Книга: Справочник по CSS

Расположение элементов

Расположение элементов

margin

Задает ширины полей между элементами страницы и его соседями.

Заменяет атрибуты margin-top, margin-right, margin-bottom и margin-left.

margin: {margin-top} [{margin-right}] [{margin-bottom}] [{margin-left}];

Может быть задано от одного до четырех значений. Если задано одно значение, оно применяется ко всем четырем полям. Если задано два значения, первое относится к верхнему и нижнему полю, а второе - к левому и правому. Если задано три значения, то первое применяется к верхнему полю, второе - к левому и правому, третье - к нижнему.

Поддерживается IE начиная с 3.02 для текстовых элементов и начиная с 4.0 для нетекстовых.

Поддерживается NN начиная с 4.0

margin-top

Задает верхнее поле между элементом страницы и его соседями сверху.

margin-top: auto|{Y}|{Y}%;

Координата может быть задана как абсолютной величиной, так и процентом от высоты родителя. Предопределенное значение auto заставляет Web-обозреватель устанавливать поле самостоятельно. При этом если задан атрибут margin-bottom, значение верхнего поля устанавливается равным значению нижнего поля. Значение по умолчанию auto.

Поддерживается IE начиная с 3.02 для текстовых элементов и начиная с 4.0 для нетекстовых.

Поддерживается NN начиная с 4.0

margin-right

Задает правое поле между элементом страницы и его соседями справа.

margin-right: auto|{X}|{X}%;

Координата может быть задана как абсолютной величиной, так и процентом от ширины родителя. Предопределенное значение auto заставляет Web-обозреватель устанавливать поле самостоятельно. При этом если задан атрибут margin-left, значение правого поля устанавливается равным значению левого поля. Значение по умолчанию auto.

Поддерживается IE начиная с 3.02 для текстовых элементов и начиная с 4.0 для нетекстовых.

Поддерживается NN начиная с 4.0

margin-bottom

Задает нижнее поле между элементом страницы и его соседями снизу.

margin-bottom: auto|{Y}|{Y}%;

Координата может быть задана как абсолютной величиной, так и процентом от высоты родителя. Предопределенное значение auto заставляет Web-обозреватель устанавливать поле самостоятельно. При этом если задан атрибут margin-top, значение нижнего поля устанавливается равным значению верхнего поля. Значение по умолчанию auto.

Поддерживается IE начиная с 3.02 для текстовых элементов и начиная с 4.0 для нетекстовых.

Поддерживается NN начиная с 4.0

margin-left

Задает левое поле между элементом страницы и его соседями слева.

margin-left: auto|{X}|{X}%;

Координата может быть задана как абсолютной величиной, так и процентом от ширины родителя. Предопределенное значение auto заставляет Web-обозреватель устанавливать поле самостоятельно. При этом если задан атрибут margin-right, значение левого поля устанавливается равным значению правого поля. Значение по умолчанию auto.

Поддерживается IE начиная с 3.02 для текстовых элементов и начиная с 4.0 для нетекстовых.

Поддерживается NN начиная с 4.0

padding-top

Задает расстояние между элементом страницы и верхней границей.

pading-top: {Y}|{Y}%;

Координата может быть задана как абсолютной величиной, так и процентом от высоты родителя.

Значение по умолчанию 0, для тега <TD> 1.

Поддерживается IE и NN начиная с 4.0

padding-right

Задает расстояние между элементом страницы и правой границей.

pading-right: {X}|{X}%;

Координата может быть задана как абсолютной величиной, так и процентом от ширины родителя.

Значение по умолчанию 0, для тега <TD> 1.

Поддерживается IE и NN начиная с 4.0

padding-bottom

Задает отступ между элементом страницы и нижней границей.

pading-bottom: {Y}|{Y}%;

Координата может быть задана как абсолютной величиной, так и процентом от высоты родителя.

Значение по умолчанию 0, для тега <TD> 1.

Поддерживается IE и NN начиная с 4.0

padding-left

Задает расстояние между элементом страницы и левой границей.

pading-left: {X}|{X}%;

Координата может быть задана как абсолютной величиной, так и процентом от ширины родителя.

Значение по умолчанию 0, для тега <TD> 1.

Поддерживается IE и NN начиная с 4.0

width

Задает ширину свободно позиционирования элемента.

width: auto|{X}|{X}%;

Ширина может быть задана как абсолютной величиной, так и процентом от ширины родителя. Предопределенное значение auto заставляет Web-обозреватель устанавливать ширину элемента самостоятельно.

Значение по умолчанию auto.

Поддерживается IE и NN начиная с 4.0

height

Задает высоту свободно позиционированного элемента.

height: auto|{X}|{X}%;

Высота может быть задана как абсолютной величиной, так и процентом от ширины родителя. Предопределенное значение auto заставляет Web-обозреватель устанавливать высоту элемента самостоятельно.

Значение по умолчанию auto.

Поддерживается IE и NN начиная с 4.0

top

Задает вертикальную позицию верхней границы свободно позиционированного элемента относительно родителя.

top: auto|{Y}|{Y}%;

Координата может быть задана как абсолютной величиной, так и процентом от высоты родителя. Предопределенное значение auto заставляет Web-обозреватель позиционировать элемент самостоятельно.

Значение по умолчанию auto.

Поддерживается IE и NN начиная с 4.0

bottom

Задает вертикальную позицию нижней границы свободно позиционированного элемента относительно родителя.

bottom: auto|{Y}|{Y}%;

Координата может быть задана как абсолютной величиной, так и процентом от высоты родителя. Предопределенное значение auto заставляет Web-обозреватель позиционировать элемент самостоятельно.

Значение по умолчанию auto.

Поддерживается IE начиная с 4.0

left

Задает горизонтальную позицию левой границы свободно позиционированного элемента относительно родителя.

left: auto|{X}|{X}%;

Координата может быть задана как абсолютной величиной, так и процентом от ширины родителя. Предопределенное значение auto заставляет Web-обозреватель позиционировать элемент самостоятельно.

Значение по умолчанию auto.

Поддерживается IE и NN начиная с 4.0

right

Задает горизонтальную позицию правой границы свободно позиционированного элемента относительно родителя.

right: auto|{X}|{X}%;

Координата может быть задана как абсолютной величиной, так и процентом от ширины родителя. Предопределенное значение auto заставляет Web-обозреватель позиционировать элемент самостоятельно.

Значение по умолчанию auto.

Поддерживается IE начиная с 4.0

float

Определяет обтекание элемента другими слева или справа вместо помещения под ним.

float: none|left|right;

Поддерживается IE начиная с 4.0 для кнопок и внедренных объектов и начиная с 5.0 - для остальных элементов страницы.

Поддерживается NN начиная с 4.0

vertical-align

Задает вертикальное выравнивание элемента страницы внутри родителя.

vertical-align: auto|baseline|sub|super|top|text-top|middle|bottom|text-bottom;

Поддерживается IE начиная с 4.0

overflow

Задает поведение элемента страницы, если содержимое в нем не помещается.

overflow: visible|scroll|hidden|auto;

Поддерживается IE начиная с 4.0

overflow-x

Задает поведение элемента страницы, если его ширина меньше ширины содержимого.

overflow-x: visible|scroll|hidden|auto;

Поддерживается IE начиная с 4.0

overflow-y

Задает поведение элемента страницы, если его высота меньше высоты его содержимого.

overflow-y: visible|scroll|hidden|auto;

Поддерживается IE начиная с 4.0

zoom

Задает масштаб отображения элемента страницы.

zoom: normal|{Масштаб}|{Масштаб}%;

Масштаб может быть задан как числом с плавающей точкой, обозначающим степень увеличения или уменьшения, так и процентной величиной. Предопределенное значение normal задает масштаб 1.0 или 100%.

Значение по умолчанию normal.

Поддерживается IE начиная с 5.5

table-layout

Позволяет "зафиксировать" значения ширины ячеек таблицы.

table-layout: auto|fixed;

Другими словами, задание значения auto позволит точно "подогнать" значения ширин ячеек, но таблица при этом будет выводиться очень долго. Значение fixed этого атрибута позволит Web-обозревателю вывести таблицу значительно быстрее, но Web-дизайнер должен будет сам задать значения ширин ячеек. Это может сильно ускорить вывод больших таблиц на экран.

Применяется только для тега <TABLE>.

Поддерживается IE начиная с 5.0

Оглавление книги