Материалы представленные на сайте исключительно с целью ознакомления пользователям Интернета и не преследуют коммерческих целей или нарушение авторских прав.
© 2018 - 2024
Свойство задаёт насыщенность шрифта.
| font-weight | |
| Значения: | |
| normal | Значение по умолчанию, устанавливает нормальную насыщенность шрифта. Эквивалентно значению насыщенности, равной 400. |
| bold | Делает шрифт текста полужирным. Эквивалентно значению насыщенности, равной 700. |
| bolder | Насыщенность шрифта будет больше, чем у предка. |
| lighter | Насыщенность шрифта будет меньше, чем у предка. |
| 100, 200, 300, 400, 500, 600, 700, 800, 900 | Значение 100 соответствует самому легкому варианту начертания шрифта, а 900 — самому плотному. При этом, эти числа не определяют конкретной плотности, т.е. 100, 200, 300 и 400 могут соответствовать одному и тому же варианту слабой насыщенности начертания шрифта; 500 и 600 — средней насыщенности, а 700, 800 и 900 могут выводить одинаковое очень насыщенное начертание. Распределение плотности так же зависит от количества уровней насыщенности, определенных в конкретном семействе шрифтов. |
| initial | Устанавливает значение свойства в значение по умолчанию. |
| inherit | Наследует значение свойства от родительского элемента. |
Синтаксис
| h1 {font-weight: normal;} span {font-weight: bold;} span {font-weight: bolder;} span {font-weight: lighter;} h1 {font-weight: 100;} |
Размер шрифта font-size
Свойство определяет размер (кегль) шрифта.
| font-size | |
| Значения: | |
| absolute-size | xx-small, x-small, small, medium, large, x-large, xx-large. Абсолютные размеры определены относительно друг друга и коэффициент масштабирования между двумя соседними абсолютными размерами составляет примерно 1,5 при переходе от меньшего к большему и 0,66 при переходе от большего к меньшему. В качестве стандартного размера принимается medium. |
| relative-size | smaller, larger. Относительные размеры обусловливают изменение размера шрифта элемента относительно родителя. При этом размер шрифта может выйти за рамки размеров, предполагаемых для xx-small и xx-large. |
| длина | Размер шрифта устанавливается с помощью положительных значений единиц длины — px, как целых, так и дробных. |
| % | Относительное значение, вычисляется на основании любого размера, унаследованного от родительского элемента. Обеспечивает более точную настройку вычисляемого размера шрифта. Задание размеров шрифта с помощью em эквивалентно процентному значению. |
| initial | Устанавливает значение свойства в значение по умолчанию. |
| inherit | Наследует значение свойства от родительского элемента. |
Синтаксис
| h3 {font-size: small;} h1 {font-size: xx-large;}, em {font-size: large;} p {font-size: 20px;} h3 {font-size: 120%;} |
Цвет шрифта
Свойство задаёт цвет шрифта с помощью различных систем цветопередачи. Свойство наследуется.
| color | |
| Значения: | |
| HEX | В данной системе используются арабские десятичные цифры от 0 до 9 и латинские буквы от A до F. Для веб-дизайна взяты 16 основных цветов, так называемый шестнадцатеричный код цвета #RRGGBB, где каждая пара отвечает за свою долю цвета: RR – красный, GG – зеленый и BB – синий. Каждая доля цвета находится в диапазоне от 00 до FF. |
| RGB | RedGreenBlue, обозначает количество соответствующего тона (красный,зеленый,синий) в получаемом цвете. |
| RGBA | Система цветопередачи RGB, расширенная параметром Alpha, который используется для управления смешиванием цветов. Значение поддерживается IE9+, Firefox 3+, Chrome, Safari, and in Opera 10+. Последнее число определяет степень прозрачности, задается значением от 0 до 1, где 0 соответствует полной прозрачности, а 1 — непрозрачности. |
| HSL | Hue, Saturation, Lightness (Intensity) — оттенок (тон), насыщенность, светлота, цветовая модель описания цветов. Первое значение — оттенок — определяется градусом поворота цветового спектра по часовой стрелке от 0° до 360°, где 60° — желтый, 120° — зеленый, 180° — голубой, 240° — синий, 300° — фиолетовый. Второе значение определяет насыщенность выбранного оттенка и указывается в процентах в диапазоне от 0% до 100%. Чем ближе данное значение к 100%, тем цвет более чистый и сочный. Светлота или яркость (Lightness) указывается в процентах, чем выше процент, тем ярче становится цвет. Значения 0% и 100% обозначают соответственно чёрный (отсутствие света) и белый (засвеченный) цвета, в независимости от того, какой оттенок из цветового круга был выбран изначально. Оптимальное значение яркости цвета равняется 50%. Значение поддерживается IE9+, Firefox, Chrome, Safari, Opera 10+ |
| HSLA | Задает прозрачность (через Альфа-канал) элемента. Тон (от 0 до 360), насыщенность (от 0% до 100%), светлота (от 0% до 100%), прозрачность (от 0 до 1). Значение поддерживается IE9+, Firefox 3+, Chrome, Safari, and in Opera 10+. |
| имя цвета | Значение цвета задаётся кроссбраузерным названием. В настоящий момент существует 140 названий цветов. |
| initial | Устанавливает значение свойства в значение по умолчанию. |
| inherit | Наследует значение свойства от родительского элемента. |
Синтаксис
| body {color: grey;} h1 {color: #00ff00;} strong {color: rgb(0,0,255);} p {color: rgb(0%,0%,100%);} span {color: rgba(255,0,0,0.3);} h1 {color: hsl(120,100%,50%);} h1 {color: hsla(120,100%,50%,0.3);} |
Дата: 2018-12-21, просмотров: 593.