Форматирование шрифта с помощью CSS-свойств
Поможем в ✍️ написании учебной работы
Поможем с курсовой, контрольной, дипломной, рефератом, отчетом по практике, научно-исследовательской и любой другой работой

 

15. Семейство шрифтов font-family

16. Стиль начертания шрифта font-style

17. Вариант начертания букв font-variant

18. Насыщенность шрифта font-weight

19. Размер шрифта font-size

20. Цвет шрифта color

21. Краткая запись свойств шрифта font

 

CSS3-свойства для форматирования текста

 

22. Обрезка текста text-overflow

23. Перенос внутри слов word-break

24. Перенос слов в блоке word-wrap

 

Создание многоколоночной разметки с помощью модели CSS3 columns

25. Количество колонок column-count

26. Ширина колонок column-width

27. Ширина пустого пространства между колонками column-gap

28. Позиционирование элемента на несколько колонок column-span

29. Стиль разделительной линии column-rule-style

30. Ширина разделительной линии column-rule-width

31. Цвет разделительной линии column-rule-color

32. Краткая запись стилей разделительной линии column-rule

33. Установка колонок с помощью одного свойства columns


Горизонтальное выравнивание text-align

 

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

Text-align

Значения:   left Выравнивание по левому краю элемента. Значение по умолчанию для языков, в которых чтение происходит слева-направо. right Выравнивание по правому краю элемента. center Выравнивание по центру элемента, управляет выравниванием содержимого, а не самих элементов. Центрирует каждую строчку текста элемента. justify Выравнивание по ширине элемента. В выровненном по ширине тексте оба конца строки прижимаются к левому и правому краям родительского элемента. Пробелы между словами и буквами распределяются таким образом, чтобы длина всех строк была равна. Разные браузеры могут увеличить как отступы между словами, так и интервалы между буквами. initial Устанавливает значение свойства в значение по умолчанию. inherit Наследует значение свойства от родительского элемента.

Синтаксис

p {text-align: left;} p {text-align: right;} p {text-align: center;} p {text-align: justify;}

Отступ text-indent

 

Устанавливает отступ (выступ) в первой строке элемента, создавая иллюзию структурированного текста. Применяется к любому блочному элементу, значение по умолчанию 0. Если в первой строке блочного элемента присутствует изображение, то оно сдвинется вместе с остальным текстом. Наследуется.

 

Text-indent

Значение:   длина Значение задаётся в единицах длины em, px и т.д. Смещает первую строку текста. Можно использовать как положительные, так и отрицательные значения (см. пример ниже). % Величина смещения задаётся в процентах, вычисляется относительно ширины родительского блока. initial Устанавливает значение свойства в значение по умолчанию. inherit Наследует значение свойства от родительского элемента.

Синтаксис

 

p {text-indent: 5px;} p {text-indent: 2%;}

Высота строк line-height

 

 

Свойство задаёт расстояние между базовыми линиями строк текста, определяя величину, на которую увеличивается или уменьшается высота блока каждого элемента. Управляет межстрочным интервалом — дополнительным расстоянием между строками над и под текстом. Чтобы определить межстрочный интервал, нужно найти разность line-height и font-size, разницу поделить на два, а каждую половину прибавить к области содержимого сверху и снизу. Принимает только положительные значения. Стандартный межстрочный интервал эквивалентен 120%.

При равных значениях line-height и height выравнивает текст по высоте. Наследуется.

 

line-height

Значения:  
длина Значение задаётся в единицах длины, создавая фиксированное значение высоты строки. Если задать значение меньше единицы, слова в смежных строках будут находить друг на друга.
% Вычисляется относительно текущего значения свойства font-size.
число Целое или дробное числовое значение, на которое будет умножен текущий размер шрифта.
normal Значение браузера по умолчанию.
initial Устанавливает значение свойства в значение по умолчанию.
inherit Наследует значение свойства от родительского элемента.

Синтаксис

 

h1 {line-height: 20px;} h1 {line-height: 200%;} h1 {line-height: 1.2;} h1 {line-height: normal;}

 

Дата: 2018-12-21, просмотров: 491.