Это свойство определяет насыщенность шрифта, т.е. с его помощью можно сделать шрифт жирным. Основные значения: normal - обычный и bold - жирный. Некоторые браузеры поддерживают числовые значения: 100, 200,300,400,500,600,700,800,900. Для справки: 400 равносильно normal, а 700 - bold. Но я не советую вам пользоваться числами!
P {font-family: arial, verdana, sans-serif;}
DIV {
font-family: arial, verdana, sans-serif;
font-weight: bold;
}
- Создать пример
Свойство FONT-SIZE
C его помощью можно регулировать размер шрифта. В качестве единиц измерения лучше всего использовать пикселы, т.к. это универсальный способ и во всех браузерах вы увидите одинаковый результат, а это самое главное.
Давайте прикольнемся над заголовками:
h1 {
font-family: arial, verdana, sans-serif;
font-size: 18px;
}
h2 {
font-family: arial, verdana, sans-serif;
font-size: 36px;
color: red;
}
- Создать пример
Как видите с помощью этого свойства можно переопределять вид заголовков, что может быть полезно например при продвижении в поисковых системах. Ведь тексту, заключенному в заголовок поисковые системы придают большее значение, чем обычному.
Сокращенная запись. Свойство FONT
Все, перечисленные выше, свойства можно записать в краткой форме. Это помогает экономить время и делать код стилей более легким.
При этом нужно записывать значения всех свойств через пробел, в такой последовательности:
font-style_ font-variant_font-weight_font-size_font-family
Ну вот например:
P {
font-style: italic;
font-variant: normal;
font-weight: bold;
font-size: 30px;
font-family: arial, sans-serif;
}
А теперь то же самое в краткой форме:
P{ font: italic normal bold 30px arial,sans-serif; }
Еще раз обратите внимание, на то, что все значения указаны в нужной последовательности, и ЧЕРЕЗ ПРОБЕЛ. Если какое-либо свойство не указать, ему присвоится значение по умолчанию.
НУ что, теперь попрактикуйтесь, и можно приступать к следующему уроку.
Урок 5: Текст в CSS
В этом уроке мы рассмотрим основные свойства CSS отвечающие за форматирование текста.
- text-align
- text-decoration
- text-indent
- text-transform
- letter-spacing
- word-spacing
Свойство TEXT-ALIGN
Свойство выравнивания текста, аналогичное атрибуту ALIGN используемому в html. Может принимать четыре значения:
left - выравнивание по левому краю(значение по умолчанию);
right - выравнивание по правому краю;
center - выравнивание по центру;
justify - выравнивание по ширине(по правому и левому краям одновременно).
Тут все очень просто, ну вот например:
h1 { text-align:center;}
h2 {text-align:left;}
h3 {text-align:right;}
p {text-align:justify;}
- Создать пример
