Справочник по CSS

Ребята всем привет я приготовил для вас короткий справочник по CSS, это важный материал.

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

В данном справочнике перечисляются основные свойства

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

квадратных скобках, которые определяют тип значения.

Вертикальная черта «|»,
разделяющая альтернативные значения, означает исключающее ИЛИ (ИЛИ-НЕ);

 

т.е. должен быть указан один из альтернативных вариантов. Двойная вертикальная черта
«||» означает объединяющее ИЛИ (ИЛИ-И) – или и то и другое, или одно из двух


Свойства,описывающие шрифт

font-family: [перечень семейств или названий шрифтов]

Указывается разделенный запятыми перечень семейств или названий шрифтов.

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

Значениями этого свойства могут быть следующие семейства: serif
шрифт с засечками, например

Times; sans–serif – шрифт без засечек – Helvetica;
cursive – курсивный шрифт – Zarf-Chencery; fantasy – декоративный шрифт –
Western; monospace – моноширинный шрифт – Courier и другие.

Если название
гарнитуры или семейства состоит из нескольких слов, рекомендуется заключать
его в апострофы или кавычки, например ‘Times New Roman Cyr’.

Значение по
умолчанию определяется браузером.
font-style: normal | italic | oblique

Определяет начертание шрифта: нормальное (normal), курсивное (italic),
наклонное (oblique). По умолчанию – normal.

font–size: [абсолютный] | [относительный] | [точный] | [проценты]

Задается размер шрифта.

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

Абсолютные размеры шрифта указываются с помощью предопределенных
значений: xx-small | x-small | small | medium | large | x-large | xx-large.

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

Значение normal соответствует
размеру, заданному пользователем.

На дисплее градации масштабируются с
шагом 1,5, например, если medium – кегль 10, то large – кегль 15. Различные
мультимедийные устройства могут потребовать различные шкалы
масштабирования.

Значение по умолчанию – medium (средний).

Относительные размеры шрифта задаются относительно родительского элемента.

Возможные значения: larger (больше), smaller (меньше).

Например, если размер
шрифта родительского элемента medium, то значение larger преобразует шрифт
текущего элемента в large.


Точные размеры шрифта

Точные размеры шрифта указываются в единицах длины, допускаемых в
рекомендациях W3C. Это:

px – логические пиксели;
pt – логические пункты;
em – единицы размера шрифта; em подразумевает, что размер шрифта
устанавливается относительно размера шрифта в родительском элементе. 1em
равно размеру шрифта родительского элемента.

Размер шрифта в процентах задается по отношению к родительскому элементу.

Например, слово может иметь размер, на 20% больший, чем остальные слова
фразы, благодаря свойству font-size: 120%.

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

Определяет толщину шрифта.

По умолчанию – normal.

Обычно используется только
значение bold (полужирный).

Значения bolder (толще) и lighter (тоньше) являются
относительными.

Т.е. если элемент является дочерним по отношению к элементу со
значением font-weight: bold и значение свойства font-weight для него задано lighter,
то он будет отображен нормальным (normal) шрифтом.

Значения от 100 до 900,
указывают толщину так, что каждое последующее значение соответствует, по
крайней мере не меньшей жирности начертания, чем предшествующее.

Нормальный
шрифт normal соответствует номеру 400, полужирный bold – 700.
font-variant: normal | small-caps

Вариант начертания: нормальный (normal), малые прописные (small-caps).

По умолчанию – normal.
font: [font-style] || [font-variant] || [font-weight] || [font-size] || [font-family]

Свойство font является обобщающим свойством для определения font-style, fontvariant, font-weight, font-size, line-height и font-family в одном месте таблицы
стилей.

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

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

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

Пример:
h1 {font-family: Arial; font-size: 30 pt; font-weight: bold;
font-style: italic}
p {font: bold italic large Palatino, serif}


Свойства,описывающие текст

word-spacing: normal | [длина]

Задает интервал между словами.

По умолчанию – normal.

Численное выражение

указывает добавление к установленной по умолчанию величине интервала между
словами, например word-spacing: 0.4em.

Это значение может быть отрицательным,
но в этом случае могут иметь место различные ограничения, накладываемые
методами отработки.

Интервалы между словами могут также зависеть от способа
выравнивания абзаца.

Последний определяется значением свойства align.


letter-spacing: normal | [длина]

Определяет величину межсимвольного интервала.

По умолчанию – normal.

Численное выражение указывает на добавление к установленной по умолчанию
величине межбуквенных пробелов.

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

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

Задает такие параметры начертания, как подчеркивание, надчеркивание,
зачеркивание и мерцание.

Допустимые значения:
underline – подчеркивание;
overline – надчеркивание;
line-through – зачеркивание;
blink – мерцание;
none – отмена ранее установленных атрибутов.
text-transform: capitalize | uppercase | lowercase | none

Определяет преобразование регистра текста при отображении (по умолчанию
none):
capitalize – первая буква каждого слова преобразуется в заглавную;
upercase – все буквы преобразуются в заглавные;
lowercase – все буквы преобразуются в строчные;
none – отменяет установленные преобразования.
text-align: left | right | center | justify

Задает горизонтальное выравнивание текста: по левому краю (left), по правому
краю (right), по центру (center), по обоим краям (justify).
text-indent: [абсолютные единицы] | [проценты]

Указывает отступы и выступы текста, значениями которых могут быть абсолютные
единицы: px – логические пиксели, pt – логические пункты, em – единицы размера
шрифта, cm – сантиметры, mm – миллиметры и проценты.

Отступ определяет
смещение первой строки абзаца вправо относительно его левого края.

Если значение
отступа отрицательно, то первая строка смещена влево относительно левого края
абзаца, т.е. образуется выступ, например text-indent: -3em.
vertical-align: baseline | sub | super | top | text-top | middle | bottom | text-bottom |
[проценты]

Определяет вертикальное положение элемента.

По умолчанию – baseline.

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

baseline – совмещает базу элемента или его низ, если элемент не имеет базы, с
базой родительского элемента;

middle – выравнивает среднюю линию элемента по уровню «база плюс половина
высоты» родительского элемента;

 

Понравилась статья? Поделиться с друзьями:
Блог  Измайлова Павла
Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: