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

Дизайн сайта как инструмент продажи

Рассылка закрыта

При закрытии подписчики были переданы в рассылку "Левитас: Почему Ваш бизнес-сайт не работает?" на которую и рекомендуем вам подписаться.

Вы можете найти рассылки сходной тематики в Каталоге рассылок.

←   Март 2005   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
Автор
Александр Левитас

Статистика

10.132 подписчиков
-10 за неделю
←   Все выпуски   →

Уроки веб-дизайна с подробными примерами #12


Информационный Канал Subscribe.Ru
Доброго Вам времени суток, уважаемые подписчики!

Представляю Вашему вниманию двенадцатый выпуск рассылки "Уроки веб-дизайна в примерах". В этом выпуске мы продолжим знакомство с оформлением текста с помощью CSS.

Содержание выпуска:
Свойства текста.

Свойства оформления текста представлены в таблице:

КодОписание
text-decoration Определяет оформление текста. Возможные свойства:
none (по умолчанию, стандартный текст),
underline (подчеркивание),
line-through (зачеркивание),
overline (надчеркивание).
text-transform Определяет оформление регистра букв текста. Возможные свойства:
none (по умолчанию, отменяет изменение регистра букв),
capitalize (первая буква каждого слова преобразуется в заглавную),
uppercase (все буквы преобразуется в заглавные),
lowercase (все буквы преобразуется в строчные).
text-align Определяет оформление регистра букв текста. Возможные свойства:
left (по умолчанию, выравнивание по левому краю),
right (выравнивание по правому краю),
center (центрирование),
justify (выравнивание по ширине колонки).
text-indent Устанавливает величину отступа в первой строке параграфа.
line-height Устанавливает межстрочный интервал.
word-spacing Устанавливает интервал между словами.
letter-spacing Устанавливает интервал между буквами.
vertical-align Устанавливает вертикальное положение базисной линии элемента. Возможные значения: baseline, middle, sub, super, text-top, text-bottom, top, bottom.

В первом примере определим следующие свойства для оформления параграфа: отступ в 15 пикселей, размер шрифта в 12 пикселей, первая буква будет жирной и красной, а выравнивание в параграфе будет по ширине страницы. Также добавим стиль для выделения текста внутри параграфа (разреженный текст с подчеркиванием). Запишем стиль:

<STYLE>
<!--
p.par{text-indent: 15px; font-size: 14px; text-align: justify;}
p.par:first-letter {font-weight: bold; color: red;}
.spacer{letter-spacing: 5px; text-decoration: underline;}
-->
</STYLE>

В данном примере стоит пояснить использование класса ":first-letter". Это, так называемый, псевдо-класс. В нашем случае он задает стиль оформления первой буквы параграфа, определенного в классе "par". Для применения нашего стиля пишем текст параграфа внутри элемента <p class="par"> </p>. Выделяемый текст помещаем внутри элемента <span class="spacer"> </span>. Посмотрим результат:

Данный пример демонстрирует использование описанного выше стиля для параграфа. В первой строчке описания стиля определяется стиль для параграфа как целого, во второй строчке определяется стиль начертания первой буквы. В третьей строчке описывается стиль для выделения части текста внутри параграфа.

Анонс следующего выпуска

В следующем выпуске рассмотрим стили оформления графических элементов.

Новости сайта/полезные ссылки

Добавлен новый раздел: Коллекция скриптов. JavaScript.

P.S. Если Вы используете почтовую программу The Bat!, то письмо может отображаться некорректно. Для того, чтобы просмотреть правильный вариант, щелкните два раза на аттачменте Part.html и откройте письмо (кнопка "No/Нет").

http://subscribe.ru/
http://subscribe.ru/feedback/		 Подписан адрес:
Код этой рассылки: comp.design.www		 Отписаться
В избранное