2017-12-07 2 views
-1

안녕하세요 저는 부트 스트랩 navbar를 센터링하는 방법을 아는 사람이 있는지 물어보고 싶습니다.부트 스트랩 navbar의 위치 변경

HTML

<nav class="navbar navbar-default"> 
      <div class="container-fluid"> 
       <ul class="nav navbar-nav"> 
        <li class="active"><a href="#">Home</a></li> 
        <li><a href="#">History</a></li> 
        <li><a href="#">Information</a></li> 
        <li><a href="#">Geographical location</a></li> 
       </ul> 
      </div> 
     </div> 
    </nav> 

나는 네비게이션 바의 폭 그래서이없는 더 나은이 사용되지 않는 공간을 많이하지만이 맞는 변화의 왼쪽에 붙어 그리고 내가 그것을 중심 싶어요.

CSS

.navbar-default { 

width:38.5%;} 
+0

_ "안녕하세요 사람이 부트 스트랩 네비게이션 바의 중심을하는 방법을 알고 있다면 물어보고 싶다."_ - 그 질문의 종류 당신이해야하지 _us_을 물어보십시오 -하지만이 사람은 여기에 있습니다 : https://www.google.com/search?q=how+to+center+a+bootstrap+navbar – CBroe

+0

@CBroe 나는 당신이 지체되었다고 생각하지만 이미 물어볼 것을 알고 있습니다. 네가 아는 그 남자. 나는 내 가장 친한 친구에게 먼저 물어 보지 않았다면 여기서 묻지 않을 것입니다.) –

+0

그럼 당신이 찾은 것이 어떻게 도움이되지 않았는지 설명하십시오. 가서 [ask], please, [mcve]를 만드는 방법을 읽어보십시오. – CBroe

답변

0

이보십시오. 이 작업을 수행해야합니다.

.navbar-default { 
margin-left:auto; 
margin-right:auto; 
width:38.5%;} 
0

여기에 있습니다.

@media (min-width: 768px){ 
 
    .navbar-nav{ 
 
     float:none; 
 
     margin: 0 auto; 
 
     display: table; 
 
     table-layout: fixed; 
 
    } 
 
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
    <nav class="navbar navbar-default"> 
 
      <div class="container-fluid"> 
 
       <ul class="nav navbar-nav"> 
 
        <li class="active"><a href="#">Home</a></li> 
 
        <li><a href="#">History</a></li> 
 
        <li><a href="#">Information</a></li> 
 
        <li><a href="#">Geographical location</a></li> 
 
       </ul> 
 
      </div> 
 
     </div> 
 
    </nav>
또한 codepen 예 : https://codepen.io/Karadjordje/pen/eewpWO

관련 문제