Главная

Новости

Статьи и обзоры
  Горожанин
  Обнинск в Internet
  Web Design
  Hardware
  Software
  Безопасность
  Серфинг
  Игродром
  Relax
  Технологии
  Web-обзор
  Интернет-ликбез
  Опросник
  УП-Технологии
  ART.net

Ссылки

Архив

О нас

Контакты

Форумы

POPULAR.RU

la_serg

Стильные таблицы

продолжение: начало #52, #53, #54

В прошлом номере мы рассмотрели параметры описывающие свойства шрифта, такие как тип размер и т.д. Сегодня мы продолжаем рассматривать возможные параметры CSS селекторов.

Свойства текста

word-spacing Возможные значения: длина, normal - без изменений. Применяется к любому элементу. Описание: определяет расстояние между cловами.

Пример: word-spacing: 0.4em

text-decoration Возможные значения: none - нет, underline - подчеркнутый, overline - надчеркнутый, line-through - перечеркнутый, blink - мигающий (не поддерживается в IE) Применяется к любому элементу. Описание: определяет "Украшение" текста, можно использовать как одно так и несколько значений одновременно.

Пример: text-decoration:underline,overline

letter-spacing Возможные значения: длина, normal - без изменений. Применяется к любому элементу. Описание: определяет расстояние между буквами. Не работает в Нетскейпе

Пример: letter-spacing:10px

vertical-align Возможные значения: baseline, sub, super, top-text, top, middle, bottom, bottom-text, процент. Применяется к: Inline elements. Описание: определяет вертикальное позиционирование элементов по отношению к другим элементам стоящих в одном ряду. Не работает в Нетскейпе

Пример: vertical-align:middle

text-transform Возможные значения: none - нет, Capitalize - каждое слово начинается с большой буквы, UPPERCASE - каждая буква текста становится заглавной, lowercase - каждая буква текста становится маленькой. Применяется к: Inline elements. Описание: производит изменение текста содержащегося в этом элементе. Не работает в Нетскейпе.

Пример: text-transform:Capitalize

text-align Возможные значения: left - текст слева, right - текст справа, center - текст по центру, justify - текст "растянут". Применяется к: Block-level elements. Описание: определяет выравнивание текста по горизонтали.

Пример: text-align:center text-indent

Возможные значения: длина, процент. Применяется к: Block-level elements. Описание: Задает величину отступа.

Пример: text-indent:30 em.

line-height Возможные значения: normal - без изменений, длина, процент. Применяется к любому элементу. Описание: описывает высоту строчки. Меняя высоту строки, при фиксированном размере шрифта - меняется расстояние по вертикали между буквами.

Пример: line-height:120%

Группа свойств определяющих цветность и фоновые изображения

color Возможные значения: цвет. Применяется к любому элементу. Описание: определяет цвет элемента.

Пример: color:#f00000

backgroung-color Возможные значения: цвет. Применяется к любому элементу. Описание: определяет цвет фона элемента.

Пример: background-color:#f00000

background-image Возможные значения: none - нет, URL. Применяется к любому элементу. Описание: фоновое изображение.

Пример: background-image:URL(cool.gif)

background-repeat Возможные значения: repeat - размножает фоновое изображение во всех направлениях, repeat-x - размножает фоновое изображение горизонтально (ось х), repeat-y - размножает фоновое изображение вертикально (ось у), no-repeat - не повторяющиеся изображение. Применяется к любому элементу. Описание: определяет степень и направление повторения фонового изображения.

Пример: background-repeat:no-repeat

background-attachment Возможные значения: scroll - фоновое изображение скроллится всесте с содержанием документа, fixed - не скроллится. Фиксируется в одном месте. Применяется к любому элементу. Описание: возможность прокрутки фонового изображения.

Пример: background-attachment:fixed

background-position Возможные значения: процент от длинны + процент от высоты; top, middle, bottom - одно из значений; left, center, right - одно из начений; расстояние от левого края + расстояние от вершины. Применяется к: Block-level и replaced elements. Описание: положение фонового изображения (работает с background-repeat равным repeat-x или repeat-y).

Пример: background-position:50%0%

background Возможные значения: применяется к любому элементу. Описание: Обобщает все вышеперечисленные свойства.

Пример: background:no-repeat black fixed 50%0%

Возможно, сегодняшний материал Вам покажется несколько скучным, но важно понять - без знания оного дальнейшее изучение CSS весьма затруднительно ;)) Набирайтесь терпения!

#14(55)/08.05.2001