Ответы:
Bootstrap 2.3.2
<ul class="inline">
<li>...</li>
</ul>
Bootstrap 3
<ul class="list-inline">
<li>...</li>
</ul>
Bootstrap 4
<ul class="list-inline">
<li class="list-inline-item">Lorem ipsum</li>
<li class="list-inline-item">Phasellus iaculis</li>
<li class="list-inline-item">Nulla volutpat</li>
</ul>
источник: http://v4-alpha.getbootstrap.com/content/typography/#inline
Обновленная ссылка https://getbootstrap.com/docs/4.4/content/typography/#inline
Согласно документации Bootstrap 2.3.2 и 3, класс должен быть определен следующим образом:
Bootstrap 2.3.2
<ul class="inline">
<li>...</li>
</ul>
Bootstrap 3
<ul class="list-inline">
<li>...</li>
</ul>
Хотя ответ TheBrent в целом верен, он не отвечает на вопрос о том, как это сделать официальным способом начальной загрузки. Разметка для начальной загрузки проста:
<ul class="inline">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
Чтобы завершить ответ Раймонда
Bootstrap 2.3.2
<ul class="inline">
<li>...</li>
</ul>
Bootstrap 3
<ul class="list-inline">
<li>...</li>
</ul>
Bootstrap 4
<ul class="list-inline">
<li class="list-inline-item">Lorem ipsum</li>
<li class="list-inline-item">Phasellus iaculis</li>
<li class="list-inline-item">Nulla volutpat</li>
</ul>
источник: http://v4-alpha.getbootstrap.com/content/typography/#inline
Я поражен, list-inline не работал в bootstrap 4, а потом я получил его в документации по bootstrap 4.
Бутстрап 3 и 4
<ul class="list-inline">
<li class="list-inline-item">Lorem ipsum</li>
<li class="list-inline-item">Phasellus iaculis</li>
<li class="list-inline-item">Nulla volutpat</li>
</ul>
Источник: http://v4-alpha.getbootstrap.com/content/typography/#inline
Это решение работает с использованием Bootstrap v2, однако в TBS3 класс INLINE. Я не выяснил, что такое эквивалентный класс (если есть) в TBS3.
У этого джентльмена была довольно хорошая статья о различиях между v2 и v3.
http://mattduchek.com/differences-between-bootstrap-v2-3-and-v3-0/
РЕДАКТИРОВАТЬ - используйте CSS для нацеливания li
элементов, чтобы решить вашу проблему, как показано ниже
{ display: inline-block; }
В моей ситуации я был нацелен на UL, а не на LI
nav ul li { display: inline-block; }
Inline - это на самом деле не тот, который нам может понадобиться, т.е. display: inline
Начальная загрузка, насколько я наблюдатель, имеет более горизонтальную ориентацию
Для отображения списка, встроенного с другими элементами, нам нужно
display: inline; added to the UL
<ul class="unstyled inline" style="display:inline">
NB // Добавить в таблицу стилей
Согласно документации Bootstrap, вам нужно добавить класс «inline» в ваш список; как это:
<ul class="inline">
<li>Item one</li>
<li>Item two</li>
<li>Item three</li>
</ul>
Однако это не работает, так как в CSS-файле Bootstrap, похоже, отсутствует какой-либо CSS, ссылающийся на класс «inline». Кроме того, добавьте следующие строки в ваш файл CSS, чтобы он работал:
ul.inline > li, ol.inline > li {
display: inline-block;
padding-right: 5px;
padding-left: 5px;
}