Свойства границ
Свойства margin-left, margin-right, margin-top и margin-bottom определяют значения отступов вокруг содержащего их элемента в пикселах, сантиметрах или миллиметрах соответственно слева, справа, сверху и снизу. Отступ представляет собой пустое пространство, не заполненное никакими другими элементами. Данные свойства могут применяться совместно с элементами изображений, абзацев, таблиц, любых других компонентов, для которых вы хотите указать описанные здесь значения.
Пример:
Р {margin-left: 20px;}
IMG{
margin-top: 10mm:
margin-left: 15mm;
margin-bottom: 10mm:
}
Свойства padding-left, padding-right, padding-top и padding-bottom, аналогично рассмотренным выше, описывают значения отступов от видимых рамок объектов HTML, например таблиц. Величина отступов также определяется в пикселах, сантиметрах или миллиметрах. Они могут применяться как вместе, так и по отдельности.
Пример:
TABLE {
padding-left: 10рх:
padding-right:10px;
padding-top: 15px:
padding-bottom: 15px:
}
Свойства border-top-width, border-bottom-width, border-right-width и border-left-width определяют толщину видимого обрамления объектов, например таблиц и их ячеек, по правилам, аналогичным записи свойств, указанных выше.
Пример:
TD{
border-top-width: 2px:
border-bottom-width: 2px:
border-right-width: 1mm:
border-left-width: 1mm;
}
Свойство border-color описывает цвет видимого обрамления объектов — рамок изображений и бордюров таблиц.
Пример:
TABLE (border-color: blue;}
Свойства списков применяются для настройки отображения элементов нумерованных и маркированных списков, определяемых в коде HTML тегом <LI>.В языке CSS данному элементу присваиваются следующие свойства. Свойство list-style-type определяет внешний вид маркера нумерованного или маркированного списка и может принимать одно из перечисленных далее значений: попе — маркер списка не отображается; для маркированного списка disc — метка отображается в виде черного круга, circle — в виде полой окружности, square — в виде черного квадрата; для нумерованного списка decimal —метки отображаются в виде последовательности арабских чисел, lower-roman —в виде последовательности римских цифр, записанных в строчном регистре, upper-roman — в виде последовательности римских цифр в заглавном регистре, lower-alpha — в виде последовательности строчных букв, upper-alpha — в виде последовательности заглавных букв.
Пример:
LI {list-style-type: square:}
Свойство list-style-image позволяет назначить в качестве метки маркированного списка произвольное изображение.
Пример:
LI {list-style-image: URL(/images/marker.gif);}
Свойство list-style-position описывает позиционирование элементов списка и может принимать следующие значения: outside — позиционирование осуществляется по умолчанию и inside — позиционирование без отступа от левой границы рабочего окна броузера. Пример:
LI { list-style-position: inside:}
Вспомогательные свойства элементов
Свойства width и height определяют соответственно ширину и высоту объекта в пикселах, миллиметрах, сантиметрах или процентах от значения, принятого по умолчанию. Применяются они в основном для задания геометрических размеров изображений различной величины в случаях, когда их необходимо выровнять по вертикали или горизонтали. Данные свойства можно использовать как вместе, так и по отдельности.
Пример:
IMG {
height: 80%;
width: 120px:
}
Свойство float указывает на расположение какого-либо объекта в окне броузера относительно других объектов, размещенных рядом. Оно может приниматьодно из следующих значений: попе — расположение объекта по умолчанию, left — расположение объекта слева или right — расположение объекта справа.
Пример:
TD {float: left:}
Свойство clear описывает правила расположения других объектов вокруг данного элемента web-страницы. Принимает одно из следующих значений: попе —расположение объектов по умолчанию, left — расположение слева, right —справа и, наконец, both — расположение с двух сторон.
Пример:
IMG {clear: both;}
Свойство white-space применяется для управления отображением пробелов и переносов между элементами html-документа или словами текста. Свойство может использовать одно из следующих значений: normal — стандартное отображение текста, при котором несколько следующих подряд пробелов преобразуются в один, рге — допускается отображение нескольких символов пробела подряд и, наконец, nowrap — запрещен перенос строки в пределах действия элемента.
Пример:
Р {white-space: рге;}
Свойство display применяется для управления взаимным расположением текстовых строк и объектов на экране монитора. Может принимать одно из следующих значений: block — отображает перенос строки до и после объекта; list-item — переносит строку до и после объекта, а кроме того, добавляет в начало строки маркер, как в случае использования маркированного списка; inline —допускается отображение объекта на одной строке с другими элементами; none — объект не отображается.
Пример :
IMG {display: block;}
| На главную |