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

Рецепты HTML

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

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

←   Сентябрь 2002   →
 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
Автор
Влад Мержевич

Статистика

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

Рецепты HTML


Информационный Канал Subscribe.Ru
Рецепты HTML
http://html.krsk.ru

Добрый день.
Сегодня первая часть статьи посвященной селекторам, одна из важных вещей по управлению стилями элементов.

Селекторы

Селекторами называются имена стилей, в которых указаны параметры форматирования. Селекторы делятся на несколько типов: селекторы тегов, классы и идентификаторы (ID).

Селекторы тегов

Селектором может быть любой тег HTML. Для него определяются правила форматирования, такие как цвет, фон, размер и др. Правила задаются в виде:

Тег { Параметр: Значение; }

В качестве параметров используются свойства стиля.

Пример 1. Изменение тега параграфа
<html>
<head>
<style type="text/css">
P { text-align: justify }
</style>
</head>

<body>
<p>При работе на вычислительной технике необходимо сесть так, чтобы руки с предплечьями образовывали прямой угол, глаза поставить на расстояние 30-40 см от рабочей поверхности монитора. Набирать на клавиатуре следует подушечками пальцев короткими отрывистыми ударами.</p>

<p>Предельно допустимая длина ногтей для женщин составляет 12-15 мм, для мужчин 3-5 мм. При выходе длины ногтей за нормы регламентируемые ГОСТом, во избежании риска поцарапать поверхность дорогостоящей техники, оператор допускается к работе на компьютере только в верхонках.</p>

</body>
</html>


При работе на вычислительной технике необходимо сесть так, чтобы руки с предплечьями образовывали прямой угол, глаза поставить на расстояние 30-40 см от рабочей поверхности монитора. Набирать на клавиатуре следует подушечками пальцев короткими отрывистыми ударами.

Предельно допустимая длина ногтей для женщин составляет 12-15 мм, для мужчин 3-5 мм. При выходе длины ногтей за нормы регламентируемые ГОСТом, во избежании риска поцарапать поверхность дорогостоящей техники, оператор допускается к работе на компьютере только в верхонках.

После того, как стиль тега переопределен, можно использовать данный тег как обычно. Но при этом его назначенные свойства будут уже другими. Так, в примере, к тегу параграфа P применяется выравнивание по ширине.

Селекторы Class

Классы используются когда необходимо определить стиль для блока текста или задать разные стили для одного тега. Синтаксис для классов следующий:

Тег.Имя класса { Параметр: Значение; }

Чтобы указать, что тег используется с определенным стилем, к нему добавляется параметр class="Имя класса".

Пример 2. Использование классов c тегами
<html>
<head>
<style type="text/css">
P { text-align: justify } // обычный параграф
P.cite { text-align: justify; color: navy; font-style: italic; } // параграф с классом cite
</style>
</head>

<body>
<p>При работе на вычислительной технике необходимо сесть так, чтобы руки с предплечьями образовывали прямой угол, глаза поставить на расстояние 30-40 см от рабочей поверхности монитора. Набирать на клавиатуре следует подушечками пальцев короткими отрывистыми ударами.</p>

<p class=cite>Предельно допустимая длина ногтей для женщин составляет 12-15 мм, для мужчин 3-5 мм. При выходе длины ногтей за нормы регламентируемые ГОСТом, во избежании риска поцарапать поверхность дорогостоящей техники, оператор допускается к работе на компьютере только в верхонках.</p>

</body>
</html>


При работе на вычислительной технике необходимо сесть так, чтобы руки с предплечьями образовывали прямой угол, глаза поставить на расстояние 30-40 см от рабочей поверхности монитора. Набирать на клавиатуре следует подушечками пальцев короткими отрывистыми ударами.

Предельно допустимая длина ногтей для женщин составляет 12-15 мм, для мужчин 3-5 мм. При выходе длины ногтей за нормы регламентируемые ГОСТом, во избежании риска поцарапать поверхность дорогостоящей техники, оператор допускается к работе на компьютере только в верхонках.

Первый абзац выровнен по ширине с текстом черного цвета, а следущий, к которому применен класс cite - написан курсивом синего цвета.

Имена классов выбираются по желанию, главное, чтобы они были понятны и соответствовали их использованию. Можно, также, использовать классы и без указания тега. Синтаксис в этом случае будет:

.Имя класса { Параметр: Значение; }

При такой записи, класс можно применять к любому тегу.

Пример 3. Использование классов c тегами
<html>
<head>
<style type="text/css">
.cite { color: navy; font-style: italic; }
</style>
</head>

<body>
<p class=cite>При работе на вычислительной технике необходимо сесть так, чтобы руки с предплечьями образовывали прямой угол, глаза поставить на расстояние 30-40 см от рабочей поверхности монитора. Набирать на клавиатуре следует подушечками пальцев короткими отрывистыми ударами.</p>

<p><b class=cite>Предельно допустимая длина</b> ногтей для женщин составляет 12-15 мм, для мужчин 3-5 мм. При выходе длины ногтей за нормы регламентируемые ГОСТом, во избежании риска поцарапать поверхность дорогостоящей техники, оператор допускается к работе на компьютере только в верхонках.</p>

</body>
</html>


При работе на вычислительной технике необходимо сесть так, чтобы руки с предплечьями образовывали прямой угол, глаза поставить на расстояние 30-40 см от рабочей поверхности монитора. Набирать на клавиатуре следует подушечками пальцев короткими отрывистыми ударами.

Предельно допустимая длина ногтей для женщин составляет 12-15 мм, для мужчин 3-5 мм. При выходе длины ногтей за нормы регламентируемые ГОСТом, во избежании риска поцарапать поверхность дорогостоящей техники, оператор допускается к работе на компьютере только в верхонках.

Классы удобно использовать, когда нужно применить стиль к разным тегам веб-страницы: ячейкам таблицы, ссылкам, параграфам и др. Для изменения отдельных слов или даже букв, а также блоков, содержащих в себе разные элементы употребляются теги SPAN и DIV.

Продолжение следует...

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

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