导航栏高度问题

时间:2014-09-19 00:58:52

标签: twitter-bootstrap navbar

我需要你的帮助...我在导航栏中插入了一个图像但是我的图像适合导航栏我需要在顶部和底部有一些空间我只想增加品牌文字的字体大小。我不知道如何调整它,我试图放一些css但没有任何事情发生。

请看。

<div class="navbar-header">

    <a href="index.html"  class="brand"><img src="images/egtdesign-logo.png">EGT DESIGN</a>

      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#nav-collapse">

         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
       </button>

</div>        
    <!--MENU and SOCIAL MEDIA LINK-->
    <div class="collapse navbar-collapse navbar-right" id="nav-collapse">

     <ul class="nav navbar-nav " >
          <li class="active"><a href="index.html"><span class="glyphicon glyphicon-home"></span> HOME</a></li>
           <li><a href="portfolio.html"><span class="glyphicon glyphicon-book"></span> PORTFOLIO</a></li>
           <li><a href="" data-toggle="modal" data-target="#modal-contact-form"><span class="glyphicon glyphicon-envelope"></span> CONTACT</a>
           </li>

           <!--SOCIAL MEDIA -->
            <li><a href="http://www.facebook.com"><img src="images/facebook_ico.png" alt="EGT Design"></a></li>
            <li><a href="http://www.twitter.com"><img src="images/twitter_ico.png"></a></li>
             <li><a href="http://plus.google.com"><img src="images/google plus.png"></a></li>
             <li><a href="https://www.linkedin.com/uas/login"><img src="images/Linkdin_ico.png"></a></li>

      </ul>
    </div><!--END MENU collapse-->

</div><!--END OF CONTAINER-->

1 个答案:

答案 0 :(得分:0)

你正在使用Twitter bootstrap?把你的CSS放在twitter bootstrap css下面,这样你的自定义css就会覆盖它。

在图像的顶部和底部放置一些空格。

a.brand img{margin-top:10px; margin-bottom:10px;}

如果您想增加品牌文字的字体

a.brand{font-size:20px;}