Свойства текста
Свойства текста применяются практически ко всем элементам CSS, которые могут включать в себя или описывать текст, правда, с учетом некоторых ограничений в каждом отдельном случае.
Свойство text-align задает расположение текста относительно границ рабочего окна броузера или ячейки таблицы, иными словами — отвечает за выравнивание текстового блока. Соответственно, оно применяется совместно с так называемыми «блоковыми элементами», то есть элементами, поддерживающими отображение текстовых массивов: P, H1-H6, TD, TR и некоторыми другими.
Можно использовать одно из четырех значений данного свойства: left — выравнивание по левой границе экрана или ячейки таблицы, right — по правой границе, center — выравнивание по центру и justify — растягивание текста по всей ширине экрана или табличной ячейки.
Пример:
Р {text-align: justify;}
Свойство text-decoration. Управляет начертанием символов: с его помощью можно задать эффекты отображения зачеркнутого или подчеркнутого текста. Данное свойство может принимать одно из следующих значений: попе — отсутствие всяких эффектов, underline — подчеркнутый текст, line-through — перечеркнутый текст, overline — надстрочный текст и blink — мерцающий текст. Обратите внимание на то, что значение overline данного свойства не поддерживается броузером Netscape Navigator, а значение blink — наоборот, программой Microsoft Internet Explorer.
Пример:
A {text-decoration: none:}
ПРИМЕЧАНИЕ Включение в файл CSS элемента А в совокупности с определением «text-decoration: none» отменяет подчеркивание гиперссылок в документах HTML.
ВНИМАНИЕ Элемент А может быть представлен в тексте файла CSS с использованием четырех определений: link — просто размещенная на web-страницессылка, active описывает состояние ссылки, нажимаемой пользователем в данный момент времени, hover — состояние ссылки в момент, когда пользователь навел на нее курсор мыши и visited отображает посещенную ссылку. Определения состояний записываются через двоеточие после названия элемента, например, A: visited{color:2F4F4F;}.
Свойство text-indent, применяемое, как правило, совместно с элементом Р, указывает на отступ первой строки текстового блока в пикселах, сантиметрах, миллиметрах или в процентах от общей длины строки. Например, его используют для организации табулированных абзацных отступов, так называемых «красных строк».
Пример:
Р {text-indent: 30pt;}
Свойство line-height устанавливает межстрочный интервал текста web-страницы в пикселах, сантиметрах, миллиметрах или процентах от интервала, определенного по умолчанию. К этому свойству можно применить значение normal, оставляющее определенный в настройках клиентского броузера межстрочный интервал без изменений.
Пример:
Р { line-height: 5px;}
Свойство letter-spacing устанавливает расстояние между символами текста в пикселах, сантиметрах или миллиметрах, но распознается оно только броузером Microsoft Internet Explorer. Возможно использование атрибута normal, оставляющего межсимвольный интервал, принятый по умолчанию.
Пример:
Р { letter-spacing: Зрх:}
Свойство vertical-align определяет вертикальное выравнивание текста в ячейках таблиц или графических изображений в текстовом блоке и также не распознается броузером Netscape Navigator. Оно может принимать одно из следующих значений: top — позиционирование по верхней границе ячейки, middle — по центру ячейки, bottom — по нижней границе ячейки, baseline — по условной базовой линии, top-text — по верхней точке текстовой строки, bottom-text по нижней точке текстовой строки.
Пример:
ТО {vertical-align: top:}
IMG {vertical-align: top-text;}
Свойство text-transform задает трансформацию определяемого элементом текстового блока: normal — стандартное отображение текста без каких-либо изменений, capitalize — каждое слово абзаца начинается с заглавной буквы, при этом регистр символов, определенный в коде HTML, игнорируется; uppercase — все символы текста становятся заглавными и, наконец, lowercase — все символы становятся строчными. Это свойство поддерживается только броузером Microsoft Internet Explorer.
Пример:
CAPTION {text-transform: capitalize;}
Свойства цвета и фона
Свойство color определяет цвет любого элемента CSS.
Пример:
SMALL {color: red:}
Свойство background-color указывает на цвет фона какого-либо элемента, причем этот цвет устанавливается именно для отображения элемента, а не всего html-документа. Учтите, что интерпретаторы разных броузеров обрабатывают данное свойство неодинаковым образом: например, Netscape Navigator выделяет фоновым цветом сам элемент страницы, причем выделение ограничивается его видимой шириной, a Internet Explorer растягивает выделение на всю ширину страницы.
Пример:
H1 { background-color: #f00000;}
Свойство background-image устанавливает фоновое изображение всего документа или ячейки таблицы. С ним можно использовать параметр попе, указывающий на то, что данная страница не содержит фоновых изображений.
Пример:
BODY {background-image: URL(/images/picture.gif):}
Свойство background-repeat определяет параметры повторения (копирования)фонового изображения в разных направлениях видимой части html-документа.Может принимать одно их следующих значений: no-repeat — не повторять изображение; repeat — повторять изображение во всех направлениях; repeat-x —только по горизонтали; repeat-y — только по вертикали.
Пример:
BODY {background-repeat: no-repeat:}
Свойство background-attachment устанавливает правила скроллинга фонового изображения. Может принимать одно из двух значений: scroll заставляет фоновое изображение двигаться вместе с содержимым web-страницы при прокрутке документа, a fixed фиксирует изображение на экране.
Пример:
BODY { background-attachment: scroll:}
Свойство background-position, в случае если значение свойства background-repeat установлено repeat-x или repeat-y, позволяет зафиксировать положение фонового изображения. Оно может принимать следующие значения: top — позиционирование по верхней границе экрана, middle — по центру экрана, bottom — по нижней границе, left — выравнивание по левой границе экрана или ячейки таблицы, right — выравнивание по правой границе, center — выравнивание по центру. Можно также указать в качестве значения этого свойства расстояние от левой и верхней границы видимой части экрана до изображения в пикселах, миллиметрах или сантиметрах.
Пример использования:
BODY {background-position: 30cm 0cm;}
TD {background-position: middle:}
| На главную |