Отправляет email-рассылки с помощью сервиса Sendsay

Рецепты HTML

  Все выпуски  

Рецепты HTML


Информационный Канал Subscribe.Ru

Рецепты HTML
http://html.krsk.ru
Добрый день!
Сегодня первая часть статьи, посвященная использованию стилей применительно к тексту. Материал многим известный, но кому-то может и пригодиться.
Статья доступна по адресу http://html.krsk.ru/css/text.asp

CSS Текст

С помощью CSS можно определять стиль и вид текста. Аналогично тому, что используется тег FONT, задающий свойства шрифта, но стили обладают большими возможностями и позволяют сократить код HTML.

Свойства шрифта

Свойство Значение NC IE Описание Пример
font-family имя шрифта
4+
4+
Задает список шрифтов p {font-family: Arial, serif}
font-style normal
italic
oblique
4+
4+
 
4+
4+
4+
Нормальный шрифт
Курсив
Наклонный шрифт
p {font-style: italic}
font-variant normal
small-caps
 
4+
4+
Капитель
(особые прописные буквы)
p {font-variant: small-caps}
font-weight normal
lighter
bold
bolder
100-900
4+
4W
4+
4W
4+
4+
4+
4+
4+
4+
Нормальная жирность
Светлое начертание
Полужирный
Жирный
100-светлый шрифт,
900-самый жирный
p {font-weight: bold}
font-size Размер шрифта
normal
pt
px
%

4+
4+
4+
4+

4+
4+
4+
4+

нормальный размер
пункты
пикселы
проценты

font-size: normal
font-size: 12pt
font-size: 12px
font-size: 120%

NC - Netscape Communicator, IE - Microsoft Internet Explorer; 4+ означает, что свойство поддерживается в браузере 4 версии и выше. 4W - работает только под Windows.

Замечание:
Когда размер шрифта задается абсолютными значениями, т.е. указывается конкретное значение шрифта в пунктах или пикселах, то изменить эту величину с помощью опции браузера Вид | Размер шрифта невозможно. Если шрифт установлен слишком мелким, то исправить этот недостаток читателю простыми средствами не представляется возможным. Поэтому лучше задавать размер шрифта в процентах (Пример 1).

Пример 1. Задание свойств шрифта с помощью CSS

<html>
<style>
H1 { font-family: Arial, Helvetica, Verdana, sans-serif; font-size: 150%; font-weight: light }
</style>

<body>
<H1>Заголовок</H1>
Обычный текст
</body>
</html>

Ниже приведен результат примера 1.

Заголовок

Обычный текст

В таблице Примера 2 даны некоторые параметры и результат их применения.

Пример 2. Результат использования различных параметров шрифтов
Пример Пример Пример Пример Пример
font-family: Verdana, sans-serif; font-size: 120%; font-weight: light font-size: large; font-weight: bold font-family: Arial, sans-serif; font-size: x-small; font-weight: bold font-variant: small-caps font-style: italic; font-weight: bold


Copyright Влад Мержевич. По всем вопросам пишите мне по адресу inferos@mail.ru



http://subscribe.ru/
E-mail: ask@subscribe.ru
Отписаться
Убрать рекламу

В избранное