Question

我无法在1024分辨率以上的菜单链接后面添加蓝色条带（100％）？如何添加？请指教

现在，如果我使用css添加bg颜色，它还会覆盖我不想要的徽标。蓝色条带应位于菜单标识的下方。请帮忙!!!

谢谢莫妮卡

Answer 1

删除整个导航栏品牌代码块并将其粘贴到导航栏div：

上方

<a href="yourlink.html" class="navbar-brand center-block">
<img src="http://idea66.com/mobile/images/logo.png" alt="company name"></a>

从a href

中删除class =“navbar-brand center-block”

<a href="yourlink.html">
<img src="http://idea66.com/mobile/images/logo.png" alt="company name"></a>

将class =“center-block”添加到带有徽标的img标记中（不要使用navbar-brand）

<a href="yourlink.html">
<img src="http://idea66.com/mobile/images/logo.png" class="center-block" alt="company name"></a>

它应该是这样的：

    <a href="yourlink.html">
    <img src="http://idea66.com/mobile/images/logo.png" class="center-block" alt="company name"></a>

   <div class="navbar navbar-default navbar-static-top myNavBar" role="navigation">

然后你可以用蓝色背景设置.myNavBar样式

为了使用徽标进行请求，您需要有两个徽标实例并使用Bootstraps响应实用程序：http://getbootstrap.com/css/#responsive-utilities

基本上，您可以通过在班级中添加hidden-xs来将徽标隐藏在导航设备上方，只需添加隐藏x：

<a href="index.htm">
<img src="images/DECSTARLogo.png" style="width:30%" class="img-responsive center-block hidden-xs" alt="company name"></a>

然后使用hidden-lg hidden-md hidden-sm将徽标的另一个实例添加回导航：

<div class="navbar navbar-default navbar-static-top myNavBar" role="navigation">
<div class="container">

<a href="yourlink.html" class="navbar-brand hidden-lg hidden-md hidden-sm">
<img src="http://idea66.com/mobile/images/logo.png" alt="company name"></a>

Bootstrap 3导航样式

1 个答案: