CSS справочник Списки, обтекание...

Списки

list-style

– определяет свойства маркера или номера позиции списка:

list-style: list-style-image | list-style-position | list-style-type

list-style-image

– вместо маркера элемента списка отображается рисунок:

list-style-image: url(xxx.jpg)

list-style-position

– определяет позицию маркера:

list-style-position: outside | inside → значение outside (по умолчанию) отображает маркер элемента списка на некотором расстоянии от строки; inside – отображает маркер элемента списка в качестве первого символа строки.

list-style-type

– определяет тип маркера или номер позиции списка:

list-style-type: disc → отображает закрашенный кружок (значение по умолчанию);

list-style-type: circle → окружность;

list-style-type: square → закрашенный квадрат;

list-style-type: decimal → маркерами являются арабские цифры;

list-style-type: lower-roman → маленькие римские цифры;

list-style-type: upper-roman → большие римские цифры;

list-style-type: lower-alpha → маленькие латинские буквы;

list-style-type: upper-alpha → большие латинские буквы;

list-style-type: none → маркер отсутствует.

Способы отображения элементов

display

– определяет способ отображения элементов страницы:

display: inline | block | none | inline-block | list-item;

display: inline → значение по умолчанию;

display: block → наделяет элементы свойствами блока;

display: none → элемент не отображается;

display: inline-block → аналогично block;

display: list-item → аналогично block, но при этом элемент страницы считается позицией списка.

visibility

– определяет видимость или невидимость элемента:

visibility: inherit | visible | hidden;

visibility: inherit → наследует видимость родительского элемента;

visibility: visible → делает элемент страницы видимым (значение по умолчанию);

visibility: hidden → невидимым.

overflow

– определяет будет ли элемент страницы иметь полосу прокрутки:

overflow: visible | scroll | hidden | auto;

overflow: visible → границы элемента расширяются по его содержимому (значение по умолчанию);

overflow: scroll → если содержимое элемента не вмещается в его границы – добавляются полосы прокрутки;

overflow: hidden → обрезает содержимое элемента по установленным размерам;

overflow: auto → полосы прокрутки отображаются если в этом есть необходимость.

overflow-x

– все как при overflow, но только по горизонтали:

overflow-x: visible | scroll | hidden | auto

overflow-y

– все как при overflow, но только по вертикали:

overflow-y: visible | scroll | hidden | auto

Обтекание

float

– задает обтекание (упорядочевание) элементов:

float: none | left | right;

float: none → обтекания нет (по умолчанию);

float: left → элементы с такими параметрами выстраиваются друг за другом слева направо;

float: right → обтекание справа налево.

clear

– отменяет обтекание:

clear: left | right | both;

clear: left → запрещает левостороннее обтекание;

clear: right → запрещает правосторонее обтекание;

clear: both → запрещает обтекание с обеих сторон.

Автор проекта - Вася Митин | Дата публикации: Октябрь 2009 | Обновление: Декабрь 2009

position, margin, padding ... Списки, обтекание ...