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

Рецепты HTML

  Все выпуски  

Рецепты HTML


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

Рецепты HTML
http://html.krsk.ru
Добрый день.
Сегодня продолжение темы посвященной селекторам, одному из важных элементов CSS.

Селекторы

Теги Span и Div

Теги SPAN и DIV широко используются вместе с селекторами классов. SPAN предназначен для изменения стиля выделенной части текста, такой как отдельный символ или их набор, а DIV позволяет применять стиль сразу к целому блоку. Перед этим тегом, в отличие от SPAN, автоматически добавляется перенос строки и пустое пространство, аналогично действию параграфа.

Пример 1. Использование тега SPAN
<html>
<head>
<style type="text/css">
.capital { font-size: 150%; color: red; }
</style>
</head>

<body>
<span class=capital>Б</span>уквица является художественным приемом оформления текста и представляет собой увеличенную первую букву, базовая линия которой ниже на одну или несколько строк базовой строки основного текста. Буквица привлекает внимание читателя к началу текста, особенно если страница лишена других ярких деталей.

</body>
</html>


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

Тег SPAN удобен для создания выделений в тексте, буквиц, цитат и др. DIV используется преимущественно для создания слоев.

Пример 2. Использование тега DIV
<div ID=layer1>
<table border="1" bgcolor="#c0c0c0">
<tr><td>Подсказка</td></tr>
</table>
</div>

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


Селекторы ID

Параметр ID задает уникальное имя элемента, которое используется для обращения к нему скриптов. Это позволяет управлять стилем элемента динамически.

Синтаксис ID селектора следующий.

#ID селектор { Параметр: Значение; }

Пример 3. Использование идентификатора ID

<style>
#help { position:absolute; left:160px; top:120px; width:225px; height:180px; z-index:1; }
</style>

<div ID=help>
<table width="100%" border="0" cellspacing="0" cellpadding="4" height="100%">
<tr>
<td bgcolor="#FFFFCC">Этот элемент помогает в случае, когда вы находитесь в осознании того факта, что совершенно не понимаете, кто и как вам может помочь. Именно в этот момент мы и подсказываем, что помочь вам никто не сможет.</td>
</tr>
</table>
</table>
</div>

В примере таблица помещена в слой с именем help. Использование идентификатора дает возможность изменять некоторые параметры таблицы, например, делать ее невидимой или видимой по желанию.



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


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

В избранное