Пример 1
<html>
<head>
<style type="text/css">
h1 {
font-family: Georgia, "Times New Roman", Times, serif;
}
h3 {
font-family: "Courier New", Courier, Monaco, monospace;
}
.copy {
font-family: Arial, Helvetica, Geneva, sans-serif;
}
</style>
</head>
<body>
<br>
<h1> Введение </h1>
<p>Электронная коммерция …...</p>
<h3> Инструментарий Microsoft и электронная коммерция </h3>
<p class="copy"> Быстрое развитие коммуникационных технологий....
</p>
</body>
</html>
Рис.1. Определение типов шрифта
Определение размера шрифта
Обычно шрифт устанавливается с помощью тега <font> (например <font face=”arial”>………<.font>). Вероятно этот способ скоро выйдет из употребления, так как в последних версиях HTML, соответствующих стандартам, тег <font> отсутствует, его рекомендуется заменять CSS.
Основные проблемы, возникающие при использовании тега <font>, заключаются в следующем:
Этот тег нужно добавлять каждый раз, когда необходимо установить шрифт. Соответственно размер файла значительно увеличивается;
Менять свойства шрифта нужно в каждом теге, что очень не удобно.
CSS решает обе эти проблемы. Не добавляя дополнительных тегов, можно управлять видом текста, заключенного в тег, внося изменения лишь в одну строку документа.
В HTML есть семь различных размеров шрифта, но все они связаны с размером, установленным по умолчанию посетителем страницы. С помощью CSS можно изменять размер текста на экране несколькими способами, включая традиционное изменение размера в точках, проценты, абсолютный размер и даже размер, зависящий от окружающего текста.
Алгоритм:
1. Введите font-size и поставьте двоеточие:
font-size:
2. Укажите размер шрифта одним из следующих способов:
- в единицах длинны – измеряется в пунктах;
- используя абсолютное выражение, например xx-small, x-small, small, medium, large, x-large, xx-large;
- smaller и larger описывает размер по отношению к размеру родительского элемента;
- в процентах, определяющих размер шрифта пропорционально размеру шрифта родительского элемента (например 75%).
Пиксели и пункты:
Аббревиатура pt обозначает пункт. Это один из способов указания размеров шрифта. Обычно используется шрифт 12pt, который удобен для большинства читателей. Лучше измерять шрифт в пикселях (px).Пиксели не всегда надежны, но результат их использования более точен.
Между пикселями и пунктами не существует однозначного соответствия, но можно считать, что 12px примерно совпадает с 12pt.
Пример 2
<html>
<head>
<style type="text/css">
.copy {
font-size: 12px;
}
blockquote {
font-size: 2em;
}
h3 {
font-size: large;
}
</style>
</head>
<body>
<br>
<h3> Введение </h3>
<p class="copy">Электронная коммерция является одним из самых модных течений практически во всех отраслях бизнеса. Она открывает новые возможности в любой сфере,
независимо от того, ориентируетесь ли вы на конечного покупателя или работаете с деловыми партнерами.</p>
<blockquote> Инструментарий <br> Microsoft <br> и электронная коммерция <br>
</blockquote>
</body>
</html>
Рис.2. Установление размера шрифта
Курсив
Часто путают два типа стилей – курсив (italic) и наклонный (oblique). Курсивом называется более декоративный тип шрифта с наклоном вправо. Наклонный шрифт представляет собой обычный шрифт, без каких-либо стилизованных украшений, с небольшим наклоном (рис.3).
Рис.3. Курсивное и наклонное начертание
С помощью элемента font-style можно выделить текст курсивом, сделать шрифт наклонным или оставить его начертание обычным (normal).