Студопедия.Орг Главная | Случайная страница | Контакты | Мы поможем в написании вашей работы!  
 

Свойство шрифтов font позволяет задать одну или несколько характеристик шрифта: font-family| font-style | font-variant | font-weight| font-size



Свойство Описание значения
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 | Нарушение авторского права страницы | Мы поможем в написании вашей работы!



studopedia.org - Студопедия.Орг - 2014-2024 год. Студопедия не является автором материалов, которые размещены. Но предоставляет возможность бесплатного использования (0.006 с)...