Воскресенье, 2024-05-19, 3:41 PM
Статьи - CSS
Приветствую Вас Гость | RSS
Главная страница Каталог статей Регистрация Вход
Меню сайта

Категории каталога
CSS [21]
Статьи по CSS

Наш опрос
Какую технологию вы предпочитаете?
Всего ответов: 250

Начало » Статьи » CSS » CSS

Свойства CSS1. Спецификация CSS1 (Часть1)
Таблицы стилей влияют на внешний вид документа путем присвоения тех или иных значений свойствам стилей. В данном разделе перечисляются определения свойств стилей и приводится соответствующий перечень значений, допускаемых CSS1.

5.1 Разъяснение значений свойств.
В настоящем тексте допустимые значения для каждого свойства перечисляются с синтаксисом, подобным приведенному ниже:

Значение: N | NW | NE
Значение: [ <length> | thick | thin ]{1,4}
Значение: [<family-name> , ]* <family-name>
Значение: <url>? <color> [ / <color> ]?
Значение: <url> || <color>

Слова между "<" and ">" дают нам тип значения. Наиболее распространенными типами являются <length> (длина), <percentage> (доля, процент), <url>, <number> (число) и <color> (цвет); они описаны в разделе 6. Более специфические типы (такие, как <font-family> и <border-style>) описаны в разделах соответственно свойствам.*

Другой вид слов - ключевые, которые должны указываться литерально, без знаков препинания. Знаки "слеш" (/) и запятая (,) также должны указываться литерально.

Если что-то размещается рядом, то это значит, что действия должны производиться в указанном порядке. Вертикальная черта (A|B) означает исключающее ИЛИ (ИЛИ-НЕ); должно происходить одно из двух. Двойная черта (A||B) означает объединяющее ИЛИ (ИЛИ-И) - или и то и другое, или одно из двух. Квадратные скобки([]) - группировка. Расположение рядом важнее, чем ИЛИ-И, а последнее важнее, чем ИЛИ-НЕ. Так, "a b | c || d e " равноценно "[ a b ] | [ c || [ d e ]]".

Каждый знак, ключевое слово или группа в скобках могут следовать за одним из модификаторов:

Звездочка (*) означает, что предшествующие знак, слово или группа повторяются ноль или более раз.
Плюс (+) означает, что предшествующие знак, слово или группа повторяются один или более раз.
Знак вопроса (?) означает, что предшествующие знак, слово или группа являются необязательными (optional).
Два числа в фигурных скобках ({A,B}) означают, что предшествующие знак, слово или группа повторяются не менее чем А и не более чем В раз.
5.2 Свойства шрифта
Определение свойств шрифта относится к одному из наиболее распространенных способов применения таблицы стилей. К сожалению, пока нет четкого и универсального стандарта для типометрии шрифтов, и определения, применимые к шрифтам одного семейства, могут оказаться неподходящими для других. Так, для обозначения курсива обычно используется свойство 'italic', но могут встречаться и такие обозначения, как Oblique, Slanted, Incline, Cursive или Kursiv. Таким образом, преобразование характерных черт шрифта в типометрические свойства является непростой задачей.

CSS1 определяет следующие свойства шрифтов: "семейство" ('font-family'), "начертание" ('font-style'), "вариант" ('font-variant'), а также "вес" ('font-weight'), "размер" ('font-size'), "шрифт" 'font'.

5.2.1 Распознавание шрифта.
В связи с отсутствием общепринятой классификации свойств шрифта, распознавание свойств гарнитуры шрифта должно быть произведена особенно тщательно. Свойства идентифицируются в четко выраженном порядке, чтобы результаты распознавания были настолько последовательными, насколько позволяют UA (предполагается, что на каждом из последних установлена одна и та же библиотека гарнитур шрифта).

1. UA создает базу относящихся к CSS1 свойств всех известных для UA шрифтов. UA может быть осведомлен о шрифте, если тот был установлен локально или загружен из Интернет. Если найдены два шрифта с одинаковыми свойствами, один из них игнорируется.

2. Применительно к данному элементу и для каждого из символов данного элемента, UA подбирает свойства шрифта, применимые к этому элементу. Основываясь на полном наборе свойств, UA использует свойство "семейство" ('font-family') для выбора пробного семейства шрифта. Остальные свойства проверяются на предмет того, насколько пробное семейство соответствует критериям распознавания, описываемым каждым из свойств. Если все остальные свойства могут быть распознаны UA, то распознавание гарнитуры шрифта считается завершенным.

3. В случае, если в процедуре п. 2 не удается распознать гарнитуру шрифта, и если в запасе есть другое альтернативное семейство шрифтов, процедура п. 2 повторяется применительно к последнему.

4. Если гарнитуру шрифта удалось распознать, но оно не содержит глифа для текущего символа, процедура п. 2 повторяется для следующего альтернативного начертания шрифта, если таковое имеется. См. в приложении С описание шрифтов и кодировок.

5. Если с помощью процедуры п.2 не удалось распознать гарнитуру шрифта, берется гарнитура шрифта, определенного для UA по умолчанию, затем повторяется процедура п. 2, с использованием наилучших результатов, которые могут быть достигнуты со шрифтом по умолчанию.

(Вышеизложенный алгоритм может быть оптимизирован на предмет исключения дублирования проверок свойств CSS1 для каждого символа).

Из правил распознавания свойств (2) вытекает следующее:

1. "Начертание" ('font-style') пробуется в первую очередь. "Курсив" ('italic') считается распознанным если курсив явно указан, либо данная гарнитура шрифта в базе UA отмечена зарезервированными для CSS словами 'italic' (предпочтительное), или 'oblique'. В противном случае значения должны быть распознаны правильно, иначе "начертание" считается нераспознанным.

2. Следующим пробуется "вариант". "Нормальным" считается шрифт, не отмеченный как "малые прописные" ('small-caps'); "малые прописные" считается (1) шрифт, помеченный как 'small-caps', (2) шрифт, в котором синтезированы малые прописные символы или (3) шрифт, в котором строчные буквы заменены прописными. Малые прописные буквы могут быть синтезированы путем уменьшения размеров прописных букв нормального шрифта.

3. "Вес" шрифта опознается следующим и никогда не бывает неопознанным. (См. далее "Задание веса шрифта").

4. "Размер" шрифта ('font-size') должен распознаваться в допустимых пределах, установленных UA. (Обычно размеры масштабируемых шрифтов округляются до ближайшего целого пикселя, так что допуск для растровых шрифтов на экране может доходить до 20%.) Дальнейшая обработка, например, значений в единицах "м" других свойств, основано на том значении "размера", которое используется, а не на том, которое определено.

5.2.2 Задание семейства шрифта ('font-family').
Значение: [[<family-name> | <generic-family>],]*
[<family-name> | <generic-family>]
По умолчанию: определяется UA
Область приложения: все элементы
Наследование: есть
Процентное выражение: неопр.

Значение свойства представляет собой перечень гарнитур шрифтов и/или их названий в порядке приоритетности. В отличие от других свойств CSS1, здесь значения могут разделяться запятой для указания альтернатив:

BODY { font-family: gill, helvetica, sans-serif }

Имеются два типа перечней значений:

<family-name>
Названия избранных гарнитур шрифта (в последнем примере - "gill" и "helvetica").
<generic-family>
В нижеследующем примере последнее значение указывает на семейство шрифта. Определены следующие семейства:
'serif' (напр. Times)
'sans-serif' (напр. Helvetica)
'cursive' (напр. Zapf-Chancery)
'fantasy' (напр. Western)
'monospace' (напр. Courier)
В таблицах стилей дизайнерам рекомендуется использовать указание семейства шрифта в качестве последней альтернативы.
Названия семейств, содержащие пробелы, должны быть в кавычках:

BODY { font-family: "new century schoolbook", serif }

<BODY STYLE="font-family: 'My own font', fantasy">

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

5.2.3 Задание начертания шрифта ('font-style')
Значение: normal | italic | oblique
По умолчанию: normal
Область приложения: все элементы
Наследование: да
Процентное выражение: неопр.

Свойство "начертание" ('font-style') определяет выбор между нормальным (иногда обозначается также терминами "roman" или "upright"), курсивным и наклонным начертанием шрифта.

Значение "нормальный" ('normal') принимается для шрифта, если он классифицирован как нормальный ('normal') в базе шрифтов UA, в то время как "наклонным" считается шрифт, помеченный как 'oblique'. По значению "курсив" ('italic') выбирается шрифт, обозначенный как 'italic' , либо, при отсутствии такового, обозначенный как 'oblique'.

Шрифт, обозначенный как "наклонный" ('oblique') в базе шрифтов UA, может также генерироваться программным способом путем наклона линий нормального шрифта.

Шрифты, имеющие в названиях такие слова, как Oblique, Slanted или Incline, обычно обозначаются в базе данных UA как "наклонные". Шрифты, имеющие в названиях такие слова, как Italic, Cursive или Kursiv, обычно обозначаются как "курсив".

H1, H2, H3 { font-style: italic }
H1 EM { font-style: normal }

В вышеприведенном примере подчеркнутый текст, относящийся к H1, будет отрабатываться как нормальный.

5.2.4 Задание варианта шрифта ('font-variant').
Значение: normal | small-caps
По умолчанию: normal
Область приложения: все элементы
Наследование: есть
Процентное выражение: неопр.

Другой тип варьирования внутри семейства шрифтов - это "малые прописные". В таких шрифтах строчные буквы выглядят подобно заглавным, только меньше размером и с несколько иными пропорциями. Такой шрифт определяется свойством "вариант" ('font-variant' ).

Значение 'normal' определяет шрифт без малых прописных букв, 'small-caps' - с малыми прописными. Для CSS1 желательно (но не обязательно), чтобы малые прописные создавались путем замены строчных букв уменьшенными символами прописных. В крайнем случае, для замены шрифта с малыми прописными используются прописные буквы.

В нижеследующем примере в элементе H3 результатом будет шрифт в варианте "малые прописные", с подчеркнутыми наклонными малыми прописными буквами.

H3 { font-variant: small-caps }
EM { font-style: oblique }

В семействе шрифтов возможны и другие варианты, например, шрифты со старинными цифрами, малыми прописными цифрами, сжатыми или растянутыми буквами и т.п. CSS1 не предусматривает свойств для их определения.

Ядро CSS1: как для преобразования текста в написанный заглавными буквами, так и для 'text-transform' используются одинаковые соображения. (Досл.: CSS1 core: insofar as this свойство causes text to be transformed to uppercase, the same considerations as for 'text-transform' apply)

5.2.5 Задание веса шрифта ('font-weight')
Значение: normal | bold | bolder | lighter | 100 |
200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
По умолчанию: normal
Область приложения: все элементы
Наследование: есть
Процентное выражение: неопр.

Свойство "вес шрифта" определяет степень толщины линий при начертании. Это ряд значений от 100 до 900, где каждый номер указывает вес, соответствующий по крайней мере не меньшей жирности начертания, чем для предшествующего. Нормальный шрифт 'normal' соответствует номеру 400, полужирный 'bold' - 700. Другие слова, использованные вместо 'normal' или 'bold', зачастую истолковывались как названия гарнитур, и поэтому была принята численная шкала в 9 позиций.

P { font-weight: normal } /* 400 */
H1 { font-weight: 700 } /* bold */

Значения 'bolder' и 'lighter' определяют вес шрифта по отношению к унаследованного от родительского:

STRONG { font-weight: bolder }

Дочерние элементы наследуют результирующее значение веса, но не его ключевое слово.

Шрифты (данные шрифтов) обычно имеют одно или более свойств, значения которых являются терминами, описывающими их веса. Общепринятых, универсальных описаний названий весов не существует. Первичная функция этих условных имен - различать жирность внутри одного семейства шрифтов. В целом по разным семействам шрифта терминология весьма разнообразна: к примеру, шрифт, который по внешнему виду отнесли бы к полужирным, может быть назван как Регулярный (Regular), Романский (Roman), Книжный (Book), Средний (Medium), Полужирный (Semi- или DemiBold), Жирный (Bold), или как Black, в зависимости от относительной "жирности" нормального шрифта данного семейства. В связи с отсутствием стандартных названий, свойство "вес" для CSS1 в численном выражении соизмеряется со значением 400, которое соответствует нормальному шрифту данного семейства. Этому весу обычно соответствуют такие условные имена шрифтов, как Book, Regular, Roman, Normal, Medium, Обыкновенный, Книжный, Средний, Нормальный.

Соотнесение остальных весов шрифтов в семействе с их численным обозначением предполагает сохранение только относительной жирности в пределах ряда, установленного для данной семьи. Тем не менее в ряде типичных случаев можно поступать в соответствии со следующей логикой:

Если семейство шрифта уже использует числовую шкалу с девятью градациями (к примеру, как шрифт Open Type), вес шрифта может быть пересчитан напрямую.
Если гарнитура отмечена как Medium, а в семействе есть хотя бы одна, помеченная как Book, Regular, Roman или Normal, то гарнитура Medium ассоциируется с весом 500.
Шрифт, отмеченный как Bold, обычно соответствует весу 700.
Если шкала жирности шрифта имеет меньше 9 градаций, используется следующий метод интерполяции. Если значение 500 невозможно присвоить, вместо него также присваивается 400. Если невозможно присвоить одно из значений следующего ряда - 600, 700, 800, 900 - то берется ближайшее значение для более жирного шрифта, если таковое имеется, в противном случае - для менее жирного. Если невозможно присвоить одно из значений следующего ряда - 300, 200, 100, - то берется ближайшее значение для менее жирного шрифта, если таковое имеется, в противном случае - для более жирного.
Данный метод иллюстрируют два нижеследующих примера. Возьмем для некоего условного семейства шрифтов "Example1" четыре градации веса по возрастающей: Regular, Medium, Bold, Heavy. Возьмем также шесть градаций веса для другого условного семейства шрифтов "Example2": Book, Medium, Bold, Heavy, Black, ExtraBlack. Обратите внимание на то, как во втором примере шрифт "Example2 ExtraBlack" не был с чем-либо ассоциирован.

Доступные шрифты Назначен вес Включены также
"Example1 Regular" 400 100, 200, 300
"Example1 Medium" 500
"Example1 Bold" 700 600
"Example1 Heavy" 800 900

Доступные шрифты
Назначен вес
Включены также
"Example2 Book" 400 100, 200, 300
"Example2 Medium" 500
"Example2 Bold" 700 600
"Example2 Heavy" 800
"Example2 Black" 900
"Example2 ExtraBlack" (none)

В зависмости от того, как ключевые слова 'bolder' и 'lighter' делают шрифт в семействе жирнее или светлее, и в связи с тем, что семейство шрифта может не содержать шрифтов, соответствующих всем весовым значениям, обработка значения 'bolder' до следующего более жирного и значения 'lighter' до менее жирного ограничена для UA пределами семейства шрифта. Если точнее, то ключевые слова 'bolder' и 'lighter' означают следующее.

Значение 'bolder' выбирает для шрифта следующий вес, соответствующий более жирному шрифту, чем родительский. Если такого веса нет, то обычно используется ближайшее большее численное значение (при сохранении шрифта неизменным), если наследуемое значение не было равно 900, в противном случае вес остается равным 900.
Аналогично со значением 'lighter', но в обратном порядке: выбирается ближайшее значение, соответствующее менее жирному шрифту, если же таковой отсутствует, то принимается ближайшее численное значение для менее жирного шрифта, при сохранении шрифта неизменным.
Это не дает гарантии, что для любого значения "веса" найдется более жирный шрифт; к примеру, некоторые фонты бывают только нормальными или полужирными, остальные могут иметь восемь гарнитур с различным весом. Нельзя заранее угадать, как именно UA сопоставит формализованные шрифтовые параметры с конкретными шрифтами различной жирности. Можно быть уверенным лишь в том, что шрифт заданного наименования будет не менее жирным, чем имеющиеся в семействе менее жирные шрифты.

5.2.6 Задание размера шрифта ('font-size').
Значение: <absolute-size> | <relative-size> |
<length> | <percentage>
По умолчанию: medium
Область применения: все элементы
Наследование: есть
Процентное выражение: относительно размера шрифта
родительского элемента

<absolute-size>
Значение абсолютного размера (<absolute-size>) есть индекс таблицы размеров шрифта, поддерживаемых и отрабатываемых UA. Возможные значения следующие: [ xx-small | x-small | small | medium | large | x-large | xx-large ]. На дисплее градации масштабируются с шагом х1,5: если 'medium' - кегль 10, то 'large' - кегль 15. Различные мультимедийные устройства могут потребовать различные шкалы масштабирования. Кроме того, UA должен обеспечивать качество и разборчивость шрифтов при отработке таблицы. Для разных семейств шрифтов таблицы могут отличаться.
<relative-size>
Относительный размер (<relative-size>) отрабатывается, исходя из таблицы размеров шрифта и размера шрифта родительского элемента. Возможные значения - [ larger | smaller ]. Например, если размер шрифта родительского элемента 'medium', то значение 'larger' преобразует шрифт текущего элемента в 'large'. Если для размера шрифта родительского элемента нет близкого вхождения в таблицу, то UA волен интерполировать данные таблицы или округлить размер до ближайшего значения. UA может также экстраполировать табличные значения, если численное значение выходит за пределы зарезервированных слов.
Для значений длины и процентного выражения таблица размеров шрифта не должна приниматься в расчет, пока не будет вычислен размер шрифта элемента

Отрицательные значения не допускаются.

Для всех других свойств, значения длины 'em' и 'ex' относятся к размеру шрифта текущего элемента. Для свойства "размер шрифта" эти единицы длины относятся к размеру шрифта родительского элемента.

Заметим, что приложения могут переиначивать явно заданный размер в зависимости от содержания. К примеру, для трехмерной сцены VR размер шрифта будет изменяться в зависимости от перспективы.

примеры:

P { font-size: 12pt; }
BLOCKQUOTE { font-size: larger }
EM { font-size: 150% }
EM { font-size: 1.5em }

Если используется градация масштабирования 1.5, то три последних случая равнозначны.

5.2.7 Задание шрифта в целом ('font')
Значение: [ <font-style> || <font-variant> |
| <font-weight> ]? <font-size> [ /
<line-height> ]? <font-family>
По умолчанию: не определено для обобщающего свойства
Область применения: все элементы
Наследование: есть
Процентное выражение: допускается для <font-size>
и <line-height>

Свойство "шрифт" есть обобщающее свойство для определения 'font-style' 'font-variant' 'font-weight' 'font-size', 'line-height' and 'font-family' в одном и том же месте таблицы стилей. Синтаксис этого свойства основан на традиционном для полиграфии способе указания группы свойств, относящихся к шрифтам.

Для определения допускаемых значений и значений по умолчанию см. вышеописанные свойства. Если для тех или иных свойств значения явно не указаны, то для них принимаются значения по умолчанию.

P { font: 12pt/14pt sans-serif }
P { font: 80% sans-serif }
P { font: x-large/110% "new century schoolbook",
serif }
P { font: bold italic large Palatino, serif }
P { font: normal small-caps 120%/120% fantasy }

Во втором примере размер шрифта, указанный в процентном выражении (80%), считается от размера шрифта родительского элемента. В третьем примере высота линии, выраженная в процентах, считается от размера шрифта самого элемента.

В первых трех примерах начертание, вариант и вес шрифта явно не заданы, и по умолчанию всем им присваивается значение 'normal'. В четвертом примере вес шрифта явно указан как 'bold', стиль как 'italic', а варианту по умолчанию присваивается значение 'normal'.

В пятом примере указан вариант "малые прописные" ('small-caps'), размер (120% от родительского шрифта), высота линии (120% от размера шрифта), и гарнитура ('fantasy'). Следовательно, значение 'normal' присваивается по умолчанию двум свойствам: "стиль" и "вес".

5.3 Свойства "цвет" (color) и "фон" (background).
Эти свойства описывают цвет (зачастую именуемый как цвет переднего плана) и фон для элемента (т.е. поверхность, на которой располагается содержание). Они позволяют установить цвет фона и(или) его рисунок. Также определяются позиция изображения рисунка фона, повторяется ли он и каким образом, и где он размещается либо перемещается относительно холста.

Свойство "цвет", как правило, наследуется. Свойство "фон" не наследуется, но фон родительского элемента будет виден на просвет, т.к. по умолчанию значение цвета фона для дочерних элементов принимается как 'transparent' (прозрачный).

5.3.1 Определение цвета ('color')
Значение: <color>
По умолчанию: Определяется UA
Область применения: все элементы
Наследование: есть
Процентное выражение: неопр.

Это свойство описывает цвет текста в элементе (зачастую именуемый как цвет переднего плана). Есть несколько разных способов описать, к примеру, красный цвет:

EM { color: red } /* natural language */
EM { color: rgb(255,0,0) } /* RGB range 0-255 */

См. раздел 6.3. для описания возможных значений цвета.

5.3.2 Определение цвета обоев ('background-color').
Значение: <color> | transparent
По умолчанию: transparent
Область применения: все элементы
Наследование: нет
Процентное выражение: неопр.

Это свойство описывает цвет обоев элемента.

H1 { background-color: #F00 }

5.3.3 Определение рисунка фона ('background-image').
Значение: <url> | none
По умолчанию: нет
Область применения: все элементы
Наследование: нет
Процентное выражение: неопр.

Это свойство определяет рисунок фона элемента. При назначении изображения для рисунка фона, необходимо также определить цвет фона, который будет использоваться в случае недоступности изображения. Если изображение доступно, оно перекрывает цвет фона сверху.

BODY { background-image: url(marble.gif) }
P { background-image: none }

5.3.4 Определение повтора рисунка фона ('background-repeat').
Значение: repeat | repeat-x | repeat-y | no-repeat
По умолчанию: repeat
Область применения: все элементы
Наследование: нет
Процентное выражение: неопр.

Если рисунок фона определен, значение свойства "повтор рисунка фона" определяет, повторяется ли изображение и каким образом.

Значение 'repeat' указывает, что изображение повторяется как в горизонтальном, так и в вертикальном направлении. Значение 'repeat-x' ('repeat-y') устанавливает повтор изображения соответственно только в горизонтальном (вертикальном) направлении, создавая одну полосу из изображений от одного края до противоположного. При значении 'no-repeat' изображение не повторяется.

BODY {
background: red url(pendant.gif);
background-repeat: repeat-y;
}

В вышеприведенном примере изображение рисунка фона повторяется только в вертикальном направлении.

5.3.5 Определение привязки фона ('background-attachment').
Значение: scroll | fixed
По умолчанию: scroll
Область приложения: все элементы
Наследование: нет
Процентное выражение: неопр.

Если определен рисунок фона, значение свойства "привязка" ('background-attachment') определяет, привязан ли рисунок к холсту или перемещается вместе с содержанием.

BODY {
background: red url(pendant.gif);
background-repeat: repeat-y;
background-attachment: fixed;
}

Ядро CSS1: UA вправе рассматривать 'fixed' как 'scroll'. Тем не менее рекомендуется, чтобы они правильно отрабатывали 'fixed' по крайней мере для элементов HTML и BODY, т.к. для автора не существует возможности использовать изображение только для браузеров, поддерживающих 'fixed'. (См. гл.7).

5.3.6 Определение положения фона ('background-position')
Значение: [<percentage> | <length>]{1,2} |
[top | center | bottom] || [left |
center | right]
По умолчанию: 0% 0%
Область применения: блочные и замещаемые элементы
Наследование: нет
Процентное значение: по отношению к стороне
самого элемента

Если рисунок фона был определен, значение свойства "положение фона" определяет его начальное расположение.

При парном значении '0% 0%', верхний левый угол изображения устанавливается в верхнем левом углу поля, окружающего содержание элемента (т.е. не того поля, что окружает отступ, рамку или границу). При парном значении '100% 100%', нижний правый угол изображения устанавливается в нижнем правом углу элемента. При парном значении '14% 84%', точка изображения 14% вправо и 84% вниз будет установлена на точке элемента 14% вправо и 84% вниз.

При парном значении '2cm 2cm', верхний левый угол изображения будет установлен на расстоянии 2 см правее и 2 см ниже верхнего левого угла элемента.

Если задано только одно процентное выражение или абсолютные единицы, они устанавливают только горизонтальное положение, а вертикальное по умолчанию будет 50%. Если заданы два значения, то первое из них - горизонтальное положение. Допускаются комбинации абсолютных единиц и процентных выражений, например, '50% 2cm'. Допускаются отрицательные значения.

Для обозначения положения изображения фона могут быть также использованы ключевые слова, которые можно комбинировать с процентным выражением или абсолютными единицами. Ниже перечислены возможные комбинации ключевых слов и их расшифровка:

'top left' или 'left top' равноценны '0% 0%'.
'top', 'top center' или 'center top' равноценны '50% 0%'.
'right top' или 'top right' равноценны '100% 0%'.
'left', 'left center' или 'center left' равноценны '0% 50%'.
'center' или 'center center' равноценны '50% 50%'.
'right', 'right center' или 'center right' равноценны '100% 50%'.
'bottom left' или 'left bottom' равноценны '0% 100%'.
'bottom', 'bottom center' или 'center bottom' равноценны '50% 100%'.
'bottom right' или 'right bottom' равноценны '100% 100%'.
примеры:

BODY { background: url(banner.jpeg) right top }
/* 100% 0% */
BODY { background: url(banner.jpeg) top center }
/* 50% 0% */
BODY { background: url(banner.jpeg) center }
/* 50% 50% */
BODY { background: url(banner.jpeg) bottom }
/* 50% 100% */

Если рисунок фона привязан относительно холста (см. раздел "Определение привязки фона"), изображение устанавливается относительно холста, но не элемента. К примеру:

BODY {
background-image: url(logo.png);
background-attachment: fixed;
background-position: 100% 100%;
}

В вышеприведенном примере изображение устанавливается в нижний правый угол холста.

5.3.7 Определение свойств фона в целом ('background')
Значение: <background-color> || <background-image> |
| <background-repeat> ||<background-attachment> ||
<background-position>
По умолчанию: для обобщающего свойства не определено
Область приложения: все элементы
Наследование: нет
Процентное выражение: применительно к
<background-position>

Свойство "фон" ('background') - это обобщающее свойство для установки отдельных свойств фона (т.е. цвета, рисунка, повтора, привязки и положения) в одном правиле таблицы стилей.

Возможные значения обобщающего свойства "фон" включают совокупность возможных значений каждого из составляющих свойств.

BODY { background: red }
P { background: url(chess.png) gray 50% repeat fixed }

Свойство "фон" всегда устанавливает все совокупные свойства фона сразу. В первой строке вышеуказанного примера явно задан только цвет фона, а значения остальных свойств принимаются по умолчанию. Во второй строке все совокупные свойства заданы явным образом.

5.4 Свойства текста
5.4.1 Установка интервалов ('word-spacing')
Значение: normal | <length>
По умолчанию: normal
Область применения: все элементы
Наследование: есть
Процентное выражение: неопр.

Численное выражение длины указывает добавление к установленной по умолчанию величине интервалов между словами. Это значение может быть отрицательным, но в этом случае могут иметь место различные ограничения, накладываемые методами отработки. UA вправе самостоятельно выбирать алгоритм вычисления интервалов. Интервалы между словами могут также зависеть от способа выравнивания абзаца (последний определяется значением свойства "выравнивание" ('align')).

H1 { word-spacing: 0.4em }

Здесь интервал между словами в элементе H1 увеличен на единицу "м" ('1em')(0,4em?), (м соответствует круглой - прим. перев.).

Ядро CSS1: UA вправе квалифицировать любое значение "интервала" как 'normal' (См. раздел 7.)

5.4.2 Установка трекинга ('letter-spacing')
Значение: normal | <length>
По умолчанию: normal
Область применения: все элементы
Наследование: есть
Процентное выражение: неопр.

Численное выражение длины указывает на добавление к установленной по умолчанию величине межбуквенных пробелов. Это значение может быть отрицательным, но в этом случае могут иметь место различные ограничения, накладываемые методами отработки. UA вправе самостоятельно выбирать алгоритм вычисления интервалов. Межбуквенные интервалы могут также зависеть от способа выравнивания абзаца (последний определяется значением свойства "выравнивание" ('align')).

BLOCKQUOTE { letter-spacing: 0.1em }

Здесь межбуквенный интервал для элемента BLOCKQUOTE' увеличен на '0.1em'.

В случае значения 'normal', UA может менять межбуквенное расстояние для выравнивания абзаца. Этого не произойдет, если для "трекинга" будет указано значение длины в численном выражении:

BLOCKQUOTE { letter-spacing: 0 }
BLOCKQUOTE { letter-spacing: 0cm }

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

Ядро CSS1: UA может интерпретировать любое значение трекинга как 'normal'. (См. секцию 7.)

5.4.3 Установка оформления текста ('text-decoration')
Значение: none | [ underline || overline |
| line-through || blink ]
По умолчанию: none
Область применения: все элементы
Наследование: нет с условием см ниже
Процентное выражение: неопр.

Это свойство описывает способ оформления текста в элементе. Если в элементе нет текста (напр., элемент 'IMG' в HTML), либо в случае пустого элемента (напр. '<EM></EM>'), это свойство не имеет силы. Значение 'blink' делает текст мерцающим.

Цвет(а), требуемые для оформления текста, должны быть производными от значения свойства "цвет".

Это свойство не наследуется, но элементы должны соответствовать родительским. Например, если в элементе подчеркивание, черта должна передаваться дочерним элементам. Цвет подчеркивания остается даже в случаях, когда дочерние элементы имеют другие значения цвета.

A:link, A:visited, A:active { text-decoration:
underline }

В вышеуказанном примере будет подчеркиваться текст для всех видов ссылок (т.е. все элементы 'A' с атрибутом 'HREF').

UA должны распознавать зарезервированное слово 'blink', хотя не обязательно должны поддерживать мерцание текста.

5.4.4 Установка вертикального выравнивания текста ('vertical-align').
Значение: baseline | sub | super | top | text-top
| middle | bottom | text-bottom | <percentage>
По умолчанию: baseline
Область применения: строчные элементы
Наследуемость: нет
Процентное выражение: по отношению к свойству
"высота линии" ('line-height') самого элемента

Свойство влияет на вертикальное положение элемента. Используется набор следующих зарезервированных слов, указывающих положение относительно родительского элемента:

'baseline'
совмещает базу элемента (или его низ, если элемент не имеет базы), с базой родительского элемента
'middle'
выравнивает среднюю линию элемента (обычно изображения) по уровню "база плюс половина высоты ('x-height') родительского элемента"
'sub'
делает элемент подстрочным
'super'
делает элемент надстрочным
'text-top'
выравнивает верх элемента по верху шрифта родительского элемента
'text-bottom'
выравнивает низ элемента по низу шрифта родительского элемента
Другой набор значений свойства определяет выравнивание относительно форматируемой линии, частью которой является указанный элемент:

'top'
выравнивает вершину элемента по самому высокому элементу линии
'bottom'
выравнивает низ элемента по самому низкому элементу линии.
При использовании значений 'top' и 'bottom' могут возникать неразрешимые ситуации, когда зависимости одних элементов от других образуют замкнутый цикл.

Процентное выражение соотносится со значением свойства "высота линии" ('line-height') самого элемента. Таким способом база элемента (или низ, если таковая отсутствует) повышается на определенный уровень относительно базы родительского элемента. Допускаются отрицательные значения. Например, при значении '-100%' элемент будет опущен так, что его база достигнет уровня, где должна лежать база следующей линии. Это позволяет позиционировать по вертикали элементы, не имеющие базы - скажем, изображения, используемые для замещения букв.

Предполагается, что в будущей версии CSS в качестве значения этого свойства будет допускаться <length>.

5.4.5 Установка преобразования текста ('text-transform')
Значение: capitalize | uppercase | lowercase | none
По умолчанию: none
Область применения: все элементы
Наследование: есть
Процентное выражение: неопр.

'capitalize'
устанавливает первую букву каждого слова прописной
'uppercase'
устанавливает все буквы элемента прописными
'lowercase'
устанавливает все буквы элемента строчными
'none'
аннулирует наследованное значение.
Фактически преобразование в каждом случае будет зависеть от используемого языка . См. способы определения языка элемента в [4] .

Категория: CSS | Добавил: webmaster (2006-11-30)
Просмотров: 466 | Рейтинг: 0.0 |

Всего комментариев: 0
Имя *:
Email *:
Код *:
Форма входа

Сервисы

Поиск по каталогу

Друзья сайта

| Ссылки 1 | Ссылки 2 | Ссылки 3 |
www.webmaster.clan.su Каталог+поисковая система be number one Bakililar.az Top Sites Сервис авто регистрации в
каталогах, статьи про раскрутку сайтов, web дизайн, flash, 
photoshop, хостинг, рассылки; форум, баннерная сеть, каталог 
сайтов, услуги продвижения и рекламы сайтов Скрипт для определения тиц (Яндекс CY: индекс цитирования). Определение pr (Google Pagerank). Проверить тиц pr сайта.
Copyright WebMaster.Clan © 2006 Бесплатный хостинг uCoz