2013-12-06 7 views
0

Пожалуйста, обратитесь к фрагменту кода ниже. Это простой навигатор.Bootstrap: кнопка заголовка навигатора

К сожалению, кнопка свернуть-размыкается над маркой (потому что она разбивает линию, ведет себя как блок), что неожиданно. Ожидаемое поведение заключается в том, что оно появляется рядом. Кроме того, если я пытаюсь поплавать с .navbar-right, это не сработает. Что бы это могло быть?

http://jsfiddle.net/X3pVX/

<nav class="navbar navbar-default navbar-fixed-top" role="navigation"> 
    <!-- Brand and toggle get grouped for better mobile display --> 
    <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="btn btn-default btn-sm navbar-btn" data-toggle="collapse" data-target="#navbar-collapse"> 
       <span class="glyphicon glyphicon-chevron-down"></span> 
      </button> 
      <a class="navbar-brand" href="#">Projeto Si</a> 
     </div> 

     <!-- Collect the nav links, forms, and other content for toggling --> 
     <div class="collapse navbar-collapse" id="navbar-collapse"> 
      <form class="navbar-form form-inline navbar-right"> 
       <div class="input-group" style="max-width: 400px"> 
        <input id="filter" class="form-control input-sm" type="text" placeholder="O que você está procurando?"/> 
        <span class="input-group-btn"> 
         <button id="clearfilter" type="button" class="btn btn-sm btn-default"><span class="glyphicon glyphicon-search"></button> 
        </span> 
       </div> 
      </form> 
     </div><!-- /.navbar-collapse --> 
    </div><!-- /.container --> 
</nav> 

ответ

-1

Эй, Что вир? Я тоже из Бразилии.

У вас есть только файл html? если да, то вам нужно использовать css. никогда не используйте стиль html, HTML для контента и CSS для стиля.

создать файл css и поместить код ниже между тегом заголовка.

<head> 

<link rel="stylesheet" type="text/css" href="FileName.css" /> 
</head> 

после этого выбрать класс, который вы хотите изменить позицию и попытаться код ниже

.navbar-right { 

position:absolute; 
left:150px; 

} 

попробовать различные значения пикселей и посмотреть, что один работает лучше для вас.

Если вы ничего не знаете о css, я рекомендую http://www.w3schools.com/ Изучайте там только для понятия.

+0

У меня есть файл CSS. Игнорируйте это. Я просто хочу узнать о конкретном вопросе бутстрапа. –

+1

Вопрос связан с Twitter Bootstrap, который уже находится в его собственном CSS. Также http://www.w3fools.com/ – Eva

Смежные вопросы