Вход/Регистрация
HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов
вернуться

Дронов Владимир

Шрифт:

ВНИМАНИЕ!

Значение inherit поддерживают практически все атрибуты стиля CSS. Оно говорит Web-обозревателю, что элемент Web-страницы, к которому привязан стиль, "наследует" значение соответствующего параметра у родительского элемента. У всех атрибутов это значение по умолчанию. В дальнейшем мы не будем описывать данное значение у каждого атрибута стиля; если же какой-то атрибут стиля не поддерживает его, мы специально об этом упомянем.

С помощью атрибута стиля color мы можем, например, задать цвет горизонтальной линии HTML.

Атрибут стиля opacity позволяет указать степень полупрозрачности элемента Web-страницы:

opacity: <числовое значение>|inherit

Значение полупрозрачности представляет собой число от 0 до 1. При этом 0 обозначает полную прозрачность элемента (т. е. элемент фактически не виден), а 1 — полную непрозрачность (это обычное поведение).

Вот пример задания половинной прозрачности (значение 0,5) для текста фиксированного форматирования:

PRE { opacity: 0.5 }

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

НА ЗАМЕТКУ

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

Атрибут стиля font-weight устанавливает "жирность" шрифта:

font-weight: normal|bold|bolder|lighter|100|200|300|400|500|600|700|800|900|inherit

Здесь доступны семь абсолютных значений от 100 до 900, представляющих различную "жирность" шрифта, от минимальной до максимальной; при этом обычный шрифт будет иметь "жирность" 400 (или normal), а полужирный — 700 (или bold). Значение по умолчанию — 400 (normal). Значения bolder и lighter являются относительными и представляют следующие степени "жирности" соответственно в б'oльшую и меньшую сторону.

Пример:

CODE { font-weight: bold }

Атрибут font-style задает начертание шрифта:

font-style: normal|italic|oblique|inherit

Доступны три значения, представляющие обычный шрифт (normal), курсив (italic) и особое декоративное начертание, похожее на курсив (oblique).

Атрибут стиля text-decoration задает "украшение" (подчеркивание или зачеркивание), которое будет применено к тексту:

text-decoration: none|underline|overline|line-through|blink|inherit

Здесь доступны пять значений (не считая inherit):

— none убирает все "украшения", заданные для шрифта родительского элемента;

— underline подчеркивает текст;

— overline "надчеркивает" текст, т. е. проводит линию над строками;

— line-through зачеркивает текст;

— blink делает шрифт мерцающим (на данный момент не поддерживается Safari).

ВНИМАНИЕ!

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

Атрибут стиля font-variant позволяет указать, как будут выглядеть строчные буквы шрифта:

font-variant: normal|small-caps|inherit

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

Атрибут стиля text-transform позволяет изменить регистр символов текста:

text-transform: capitalize|uppercase|lowercase|none|inherit

Мы можем преобразовать текст к верхнему (значение uppercase этого атрибута) или нижнему (lowercase) регистру, преобразовать к верхнему регистру первую букву каждого слова (capitalize) или оставить в изначальном виде (none).

Атрибут стиля line-height задает высоту строки текста:

line-height: normal|<расстояние>|inherit

Здесь можно задать абсолютную и относительную величину расстояния, указав соответствующую единицу измерения CSS (см. табл. 8.1). При ее отсутствии заданное нами значение сначала умножается на высоту текущего шрифта и затем используется. Таким образом, чтобы увеличить высоту строки вдвое по сравнению с обычной, мы можем написать:

P { line-height: 2 }

  • Читать дальше
  • 1
  • ...
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • ...

Ебукер (ebooker) – онлайн-библиотека на русском языке. Книги доступны онлайн, без утомительной регистрации. Огромный выбор и удобный дизайн, позволяющий читать без проблем. Добавляйте сайт в закладки! Все произведения загружаются пользователями: если считаете, что ваши авторские права нарушены – используйте форму обратной связи.

Полезные ссылки

  • Моя полка

Контакты

  • chitat.ebooker@gmail.com

Подпишитесь на рассылку: