Обзор свойств CSS

Справочник опирается на актуальную сейчас спецификацию CSS 2.1, соответственно, приведенный ниже список css-свойств ограничен рамками спецификации.

Основные свойства

Список базовых свойств, которые должен знать даже начинающий веб-мастер:

margin, padding, border, background-color, color, font-family, font-size, float

Фон

background
Сокращенный вариант записи для свойств background-color, background-image, background-repeat, background-attachment и background-position.
background-attachment
Устанавливает, должна ли фоновая картинка скролиться или должна быть зафиксирована в окне браузера.
background-color
Устанавливает цвет фона для элемента.
background-image
Устанавливает фоновую картинку для элемента.
background-position
Устанавливает первоначальное положение для фоновой картинки.
background-repeat
Управляет циклическим повторением фоновой картинки.

Рамка (граница, бордюр)

Влияют на все четыре рамки

border
Краткий вариант записи для свойств border-width, border-style и border-color. Влияет на все четыре границы элемента.
border-color
Устанавливает цвет рамки со всех сторон элемента.
border-width
Устанавливает толщину рамки со всех сторон элемента.
border-style
Определяет стиль оформления рамки вокруг элемента.
border-collapse
Указывает ячейкам таблицы, иметь ли собственный бордюр или общий с соседней ячейкой.
border-spacing
Устанавливает расстояние между ячейками таблицы.

Верхняя рамка

border-top
Краткий вариант доступа к свойствам border-top-width, border-top-style и border-top-color.
border-top-color
Устанавливает цвет верхнего бордюра.
border-top-style
Устанавливает стиль линии верхнего бордюра.
border-top-width
Устанавливает ширину верхнего бордюра.

Нижняя рамка

border-bottom
Краткий вариант доступа к свойствам border-bottom-width, border-bottom-style и border-bottom-color.
border-bottom-color
Устанавливает цвет нижнего бордюра.
border-bottom-style
Устанавливает стиль линии нижнего бордюра.
border-bottom-width
Устанавливает ширину нижнего бордюра.

Левая рамка

border-left
Краткий вариант доступа к свойствам border-left-width, border-left-style and border-left-color.
border-left-color
Устанавливает цвет левого бордюра.
border-left-style
Устанавливает стиль линии левого бордюра.
border-left-width
Устанавливает ширину левого бордюра.

Правая рамка

border-right
Краткий вариант доступа к свойствам volume, border-right-style и border-right-color.
border-right-color
Устанавливает цвет правого бордюра.
border-right-style
Устанавливает стиль линии правого бордюра.
volume
Устанавливает ширину правого бордюра.

Шрифт

font
Краткий вариант записи свойств font-style, font-variant, font-weight, font-size, line-height и font-family.
font-family
Определяет шрифт(ы) для отображения текста.
font-size
Управляет размером шрифта.
font-style
Управляет наклоном шрифта (курсив).
font-variant
Управляет внешним видом строчных букв (строчные как прописные, "капитель").
font-weight
Управляет толщиной (насыщенностью) шрифта.

Позиционирование

position
Определяет порядок, в соответствии с которым элемент отображается на веб-странице.
bottom
Сдвигает элемент относительно нижнего края. Используется совместно со свойством position.
left
Сдвигает элемент относительно левого края. Используется совместно со свойством position.
page-break-before
Сдвигает элемент относительно верхнего края. Используется совместно со свойством position.
right
Сдвигает элемент относительно правого края. Используется совместно со свойством position.
z-index
Определяет порядок, в соответствии с которым элементы накладываются друг на друга, если необходимо отобразить их на одном месте.

Форматирование

clear
Запрещает/разрешает элементу обтекать "floated" объекты.
clip
Определяет область элемента, которая должна отображаться на странице.
display
Изменяет базовые свойства элементов.
float
Сдвигает элемент к правому или левому краю.
height
Определяет высоту прямоугольной области вокруг элемента.
overflow
Определят как отображать блочный элемент в случае, если его содержимое выходит за рамки родительского элемента.
visibility
Управляет настройкой видимости элемента.
width
Определяет ширину прямоугольной области вокруг элемента.

Списки

list-style
позволяет одновременно задать три параметра для маркеров пунктов списка: list-style-type, list-style-position и/или list-style-image.
list-style-image
Устанавливает изображение, которое будет использоваться для маркировки пунктов списка.
list-style-position
Определяет, как отобразить на странице маркер пункта в списке: внутри того же прямоугольника, в котором располагается элемент списка или вне его.
list-style-type
Определяет, какой вид будет иметь маркер пункта в списке..

Текст

direction
Применяется при создании сайтов на языках, в которых чтение страницы идет справа налево.
letter-spacing
Определяет длину интервала между буквами.
page-break-inside
Определяет размер межстрочного интервала.
text-align
Выравнивает содержимое блочного элемента (текст или изображение) относительно границ блока, а так же содержимое ячеек таблицы по горизонтали.
text-decoration
Определяет, какой оформительский прием нужно применить к тексту.
text-indent
Определяет размер отступа первой строки в тексте.
text-transform
Управляет написанием прописных или строчных букв в тексте.
vertical-align
Определяет высоту содержимого внутри инлайн элемента или внутри ячейки таблицы.
white-space
Определяет как отображать пробелы, символы табуляции и пустой строки.
word-spacing
Определяет расстояние между словами.

[collapse collapsed]

Печать

widows
Позволяет избежать появления висячей строки.
orphans
Позволяет избежать появления одинокой первой строки.
page-break-after
Определяет наличие или отсутствие разрыва страницы после элемента при печати.
page-break-before
Определяет наличие или отсутствие разрыва страницы перед элементом при печати.
page-break-inside
Определяет наличие или отсутствие разрыва страницы внутри элемента при печати.

Поля

padding
Сокращенный способ задать следующие параметры: padding-top, padding-right, padding-bottom и/или padding-left.
padding-bottom
Определяет ширину пространства между содержимым элемента и нижним бордюром.
padding-left
Определяет ширину пространства между содержимым элемента и левым бордюром.
padding-right
Определяет ширину внешнего пространства между правым бордюром и невидимой границей прямоугольника.
padding-top
Определяет ширину внешнего пространства между верхним бордюром и невидимой границей прямоугольника.

Прочее

caption-side
Определяет, где будет отображаться заголовок таблицы: над ней или под ней.
color
Устанавливает цвет текста элемента.
content
Применяется для того, чтобы вставить текст или изображение до или после какого-либо элемента.
counter-increment
Задает значения приращений счетчика.
counter-reset
Устанавливает идентификатор, который хранит счетчик отображений какого-либо элемента и устанавливает начальное значение этого счетчика.
cursor
Определяет вид курсора при наведении мышки на некий элемент.
empty-cells
Определяет, нужно ли отображать границы и фон ячейки, если в ней нет содержимого.
margin
Сокращенный способ задать следующие параметры: margin-top, margin-right, margin-bottom и/или margin-left
margin-bottom
Определяет ширину внешнего пространства между нижним бордюром и невидимой границей прямоугольника.
margin-left
Определяет ширину внешнего пространства между левым бордюром и невидимой границей прямоугольника.
margin-right
Определяет ширину внешнего пространства между правым бордюром и невидимой границей прямоугольника.
margin-top
Определяет ширину внешнего пространства между верхним бордюром и невидимой границей прямоугольника.
max-height
Определяет максимальную высоту элемента.
max-width
Определяет максимальную ширину элемента.
min-height
Определяет минимальную высоту элемента.
min-width
Определяет минимальную ширину элемента.
outline
Это быстрый способ задать следующие параметры: outline-width, outline-style и/или outline-color.
outline-color
Определяет цвет контура вокруг элемента.
outline-style
Определяет вид контура вокруг элемента.
outline-width
Определяет ширину контура вокруг элемента.
quotes
Определяет вид открывающей и закрывающей кавычки в тексте.
table-layout
Определяет ширину столбцов в таблице.