在徽标和菜单折叠键中间的移动菜单标题中创建一个按钮

时间:2021-06-17 作者:Juan Appleton

大家晚上好,我想在移动菜单的标题中,在徽标中间和菜单手风琴中间之间安装一个按钮(在我将发送的图像中进行解释)

我尝试过这样做,但很少只在手机的移动版本中对我有效,但在其他版本中,也不可能在google chrome的css搜索引擎中看到,当你放置响应版本时,但在其他设备中它不会出现

这是页面的链接:https://bildschulebuchs.ch/aktuelles/

这里是图像enter image description here

这是我使用的代码,但对我没有帮助

el html este:

<;

div id="masthead" class="navbar menu-primary menu-light submenu-dark style-light-original menu-with-logo">
  <div class="mobile-additional-icons">
    <a class="efectobotonn" href="https://bildschulebuchs.ch/kurse/">Kurse</a>
    </div></div>
这是使用的css:

@media screen and (max-width: 890px){
.efectobotonn {
    width: 90px;
    height: 50px;
    position: relative;
    margin: auto;
    left:-50px!important;
    top:65px!important;
    font-size: 24px!important;
    font-family: \'Roboto Mono\', -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
    border-radius: 10px;
    border: 2px solid #000;
    padding: 5px;
    border-style: dashed;
    color:#000!important;
    z-index:100;
    background-color: #fff;
}
}
我不知道是否必须调用php函数才能使其工作,但我不知道是哪一个,它在某些设备上工作,但在其他设备上不工作

如果你能帮助我,我将非常感激

1 个回复
SO网友:Ariel

如以下代码所示,z索引在移动设备上的工作方式有所不同:

#masthead:not(.menu-absolute){
z-index: 2000;
position: relative;
}
我建议您将该按钮的HTML与徽标和移动菜单放在同一行,然后在需要时隐藏/显示它。

它将放置在此HTML下

<div id="logo-container-mobile" class="col-lg-0 logo-container middle">

相关推荐

ADD_THEME_SUPPORT(‘CUSTOM-HEADER-UPLOADS’);功能有什么作用?

同时向functions.php 文件中,我发现了以下内容:add_theme_support(\'custom-header-uploads\');这到底是做什么的?我删除了条目functions.php 但对网站没有什么不同。我最初认为这与上传标题图像的能力有关,但这取决于add_theme_support(\'custom-header\');在执行搜索时,我无法在Codex中看到任何有意义的信息。这是某种贬值的特征还是我忽略了什么?