Главная Случайная страница Контакты | Мы поможем в написании вашей работы! | ||
|
Свойство | Описание значения |
font-family | Указыватся до трех шрифтов, через запятую: serif|san-serif |cursive |fantasy | monospace. |
font-style | начертания: normal (по умолчанию), italic (курсив), oblique (наклонный). |
font-variant | варианты начертания: normal (по умолчанию), small-caps (все буквы заглавные уменьшенного размера). |
font-weight | жирность шрифта: normal, bold, bolder(жирный), lighter(бледный). |
font-size | размер шрифта в абсолютных: (константы xx-small | x-small | small | medium | large | x-large | xx-large | {Абсолютный размер} или в относительных единицах или процентах: larger | smaller | {Отн. размер}%; |
Например, вот описание свойств шрифта для <p>:
<head><style type="text/css">
p {
font-style: italic;
font-variant:normal;
font-weight: bold;
font-size: 30px;
font-family: arial, sans-serif;
}
</style>
</head>
<body>
<p>Это текст, выведенный с указанными фонтами</p>
<body>
Используя сокращенную запись font, можно указывать все свойства шрифта в одном стилевом правиле:
p { font: italic normal bold 30px arial, sans-serif; }
Порядок свойств font здесь таков:
font-style|font-variant|font-weight|font-size|font-family
Свойство font-family определяет название шрифта или семейства шрифтов для отображения документа. Обычно указывается несколько шрифтов, через запятые, чтобы выбрать из них тот шрифт, который установлен на компьютере клиента. Кроме названия может указываться гарнитура (семейство) шрифтов: serif(Times New Roman, Georgia); sans - serif(Arial, Verdana); monospace(моноширинные Courier, Courier New).
Пример:
<html>
<head>
<title>Установка шрифта с помощью стилей</title>
<style type="text/css">
body {
font-family: “Times New Roman”, times, serif;/* шрифты*/
font-size: 100%; /* Размер шрифта для основного текста */
font-style: oblique;}
th {
font-family: arial, sans-serif; /* Семейства шрифтов*/
font-size: 90%; /* Размер шрифта для заголовка таблицы */
font-weight: bold /* Полужирная насыщенность*/
}
h1, h2, h3 {
font-family: verdana, tahoma, arial, sans-serif /*шрифты*/
}
#cursive { font-style: italic} /* Курсивный текст */
</style>
</head>
<body>
<div id=”cursive”>Курсивный текст</div>
<h1>Заголовок1</h1>
<h2>Заголовок2</h2>
<h3>Заголовок3</h3>
<table>
<th>Таблица</th>
</table>
</html>
Результат:
Курсивный текст
Дата публикования: 2014-11-18; Прочитано: 308 | Нарушение авторского права страницы | Мы поможем в написании вашей работы!