Twitter Bootstrap: текст на панели навигации

109

Согласно документации по загрузке twitter , я должен иметь возможность «заключать строки текста в <p>тег для правильного интерлиньяжа и цвета». Когда я это делаю, на любом уровне ниже navbarон просто не наследует ни один из navbarклассов. Если заключить строку в <a>теги, она будет отображаться, но не должна быть привязкой.

Строка, которую я пытаюсь отобразить, - это "Logged in as ... ".

html css twitter-bootstrap Джек Фрост
источник

Ответы:

237

Вы должны включить класс вместе со своим pтегом внутри панели навигации, например:

<p class="navbar-text">Logged in as</p>
Андрес Ильич
источник
2
@capncaveman, ребята из твиттера не включили это достаточно странное, но вы можете увидеть это на примерах их страниц.
Андрес Ильич
35
Как бы то ни было, пришлось использовать <p class="nav navbar-text">для правильного форматирования.
eaj
Спасибо за это! FYI @eaj w / 3.3.6 Мне не нужен .nav. Вопрос: существует ли стандартный класс Bootstrap, который отключает выделение текста <p>?
Мэтью Корнелл,
1
@MatthewCornell ничего, о чем я не знаю, но вы можете "подделать" его, задав ::selectionцвет фона и сбросив cursorсвойство по умолчанию при наведении курсора, например cursor: default;.
Андрес Ильич
2

Мне пришлось добавить, <span class="navbar-text">чтобы формат соответствовал тегам привязки.

Майло ван Лун
источник
0

Ни один из этих ответов или комментариев у меня не сработал (последнему было 6+ лет), но у меня сработало следующее:

  1. Мне пришлось использовать <span>тег, а не<p>
  2. Мне пришлось включить "nav-item"класс в сам элемент списка

Мой последний рабочий код выглядит так:

<li class="nav-item"><span class="navbar-text"><h5>{{first_name}}</h5></span></li>

Поверьте мне на слово, но слово «Салли» ниже не превращается в гиперссылку при наведении курсора.

введите описание изображения здесь

Джоэл Вигтон
источник