Горизонтальные списки ( inline )
По умолчанию
элементы списков в html располагаются один под другим (
блочно), но очень часто необходимо, чтоб они располагались в одну строку. К сожалению в свойствах списков нет специального атрибута для превращения в горизонтальный. Благодаря
css есть возможность вертикальный список превратить в горизонтальный. Это используется в основном для создания горизонтального меню.
ul li {
display:inline;
}
<ul>
<li>1 элемент</li>
<li>2 элемент</li>
<li>3 элемент</li>
</ul>
- 1 элемент
- 2 элемент
- 3 элемент
Этот способ имеет один, но очень ощутимый недостаток.
Горизонтальность списка достигается путем превращения каждого элемента в inline элемент (по умолчанию они блочные). Из-за этого
элементы теряют свойства блочного элемента и к ним не могут быть применены такие свойства как высота, ширина, а отступы применяются частично. Поэтому делать горизонтальным список этим способом нужно только в том случае если перечисленные выше свойства применятся не будут.
Добавить комментарий