Отправляет 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
Автор
Александр Левитас

Статистика

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

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


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

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

Содержание выпуска:
Классы

Если нужно определить стиль так, чтобы один и тот же элемент в разных случаях отображался по-разному, то на помощь приходят классы. Класс описывается в виде .имя_класса {свойства}. Для присвоения класса выбранному тегу используется свойство CLASS="имя_класса". Это можно продемонстрировать на следующем примере:

КодОтображение
<STYLE TYPE="text/css">
.font1 {color: yellow; background: red;}
.font2 {color: blue; background: yellow;}
</STYLE>
...
<SPAN CLASS="font1">Желтый текст на красном фоне</SPAN>
<SPAN CLASS="font2">Синий текст на зеленом фоне</SPAN>.
А здесь цвет фона и текста заданы по умолчанию. 		Желтый текст на красном фоне Синий текст на зеленом фоне. А здесь цвет фона и текста заданы по умолчанию.

В примере прописаны два класса "font1" и "font2" задающие цвет фона и изображения. Эти классы были применены к тегу <SPAN>. Свойства, прописываемые классом, могут быть присвоены любому тегу (если он обладает свойствами, описанными в классе). Например, класс font1, определенный в предыдущем примере может быть применен к таблице:

КодОтображение
<TABLE CLASS="font1">
<TR>
<TD>Это ячейка таблицы</TD>
<TD>И это тоже</TD>
</TR>
</TABLE>
Это ячейка таблицыИ это тоже

Для определения класса для определенного тега используется конструкция имя_тега.имя_класса {свойства}. Например, нам нужно часть текста выделить красным. Определим класс для тега <FONT>:

КодОтображение
<STYLE TYPE="text/css">
FONT.select {color: red;}
</STYLE>
...
Здесь мы выделили <FONT CLASS="select">часть текста</FONT>. 		Здесь мы выделили часть текста.

Если Вы решили поменять стиль выделения текста с помощью класса "select" во всем документе с красного, на другой цвет, то достаточно поменять значение цвета в одном месте - в определении этого класса. А изменения вступят в силу сразу же во всем документе. Если на всех страницах сайта подключается один и тот же стилевой файл, то изменение свойств класса в этом файле приведет и к изменению стиля соответствующий тегов на всех страницах сайта. В этом и заключается вся прелесть каскадных таблиц стилей.

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

В этом выпуске вы познакомились с практическим использованием классов CSS. В следующем выпуске рассмотрим различные стили отображения текста.

Новости сайта
Наш сайт - Уроки по веб дизайну. Еженедельные обновления. Многое, что не вошло в выпуски рассылки, вы найдете на этом сайте. Если у Вас есть тематический сайт, предлагаю обмен ссылками. Новым подписчикам будет интересен архив рассылки.
  • Косметический редизайн сайта: графика сделана более ненавязчивой и легкой.
  • Добавлен раздел Конструктор. В настоящий момент вы можете воспользоваться Конструктором заголовка HTML документа.
  • Добавлен раздел Браузеры с описанием различных браузеров.
  • Добавлены статьи Баннерные сети и Рекламные биржи. В последней статье приводится описание рекламных технологий в интернете и она будет особенно полезной для вебмастеров стремящихся получить доход со своего сайта.
  • Если у вас есть вопросы по содержанию рассылки, то вы можете воспользоваться формой обратной связи. Наиболее интересные вопросы будут опубликованы в следующем выпуске рассылки. Вы можете также высказать свои пожелания и предложения по поводу разделов сайта.

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

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