Список базовых свойств, которые должен знать даже начинающий веб-мастер:
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-styleandborder-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- Определяет ширину столбцов в таблице.