2015-11-05 75 views
0

我希望在框中圍繞文本和當前狀態之間的中途註冊較小,理想情況。在按鈕內圍繞文本的圓角矩形框

Navigation Bar image link

。我正在使用bootstrap-3。我試圖使幹訓局小(BTN-SM),它縫好像這就是問題所在。但是這沒有任何作用。 以下是我有:

.btn { 
 
    font-family: "Lucida Sans Unicode"; 
 
    font-size: 18px; 
 
} 
 
#signup { 
 
    border-color: #fff; 
 
} 
 
/*------------------------------------------------- 
 
Navigation bar 
 
-------------------------------------------------*/ 
 
.navbar-toggle { 
 
    float: left; 
 
} 
 
.navbar { 
 
    margin-bottom: 0px; 
 
    font-family: "Lucida Sans Unicode"; 
 
    font-size: 18px; 
 
}
<nav class="navbar navbar-inverse navbar-fixed-top"> 
 
      <div class="container"> 
 
      <div class="navbar-header"> 
 
       <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
 
       <span class="sr-only">Toggle navigation</span> 
 
       <span class="icon-bar"></span> 
 
       <span class="icon-bar"></span> 
 
       <span class="icon-bar"></span> 
 
       </button> 
 
       <a class="navbar-brand" href="index.html">MyWebsite</a> 
 
      </div> 
 
      <div id="navbar" class="navbar-collapse collapse"> 
 

 
       <ul class="nav navbar-nav pull-right" > 
 
       <li><a href="#">Log in</a></li> 
 
        
 
        <!-- I'm trying to get the text in the button below within a rectangle box --> 
 
       <li><a href="#" class="btn btn-inverse" id="signup">Sign up</a></li> 
 
       </ul> 
 
      </div> 
 
      </div> 
 
     </nav>

CSS:

回答

0

有按鈕和文本之間的填充/保證金,則需要在CSS文件中查找。有兩個用於引導的CSS文件。

查找這兩個CSS文件btn-sm。它將在其中一個。不過我看你也有btn btn-inverse的按鈕類。看看他們。

如果您希望按鈕的邊角更加草寫,請找到border-radius屬性。