Вы здесь: Главная > HTML > Span и Div

Span и Div

Опубликовано автором Просмотры: 10

HTML — это всё, что связано с применением значения к контенту.

В то время как большинство тегов HTML имеют значение (p создают абзац, h1 создают заголовок и т.д.), теги span и div вообще не имеют значения. Это может показаться примерно таким же полезным, как пенопластовый молоток, но на самом деле они довольно широко используются в сочетании с CSS.

Теги span и div используются для группировки фрагмента HTML и привязки к нему некоторой информации, чаще всего с атрибутами class и id для связывания элемента с селектором CSS класса или идентификатора.

Разница между span и div заключается в том, что span элемент является встроенным и обычно используется для небольшого фрагмента HTML внутри строки (например, внутри абзаца), тогда как элемент div (разделение) является блочной строкой (что в принципе эквивалентно наличию разрыва строки до и после него) и используется для группировки больших фрагментов кода.

<div id="scissors">
    <p>Это <span class="paper">безумие</span></p>
</div>

 

Тег div и особенно span, на самом деле не должны использоваться так часто. Всякий раз, когда есть разумная альтернатива, её следует использовать вместо них.

Например, если вы хотите подчеркнуть слово “безумие”, а класс “paper” добавляет курсив для визуального выделения, то для более насыщенного и значимого контента код может выглядеть следующим образом:

<div id="scissors">
    <p>Это <em class="paper">безумие</em></p>
</div>

Если вы ещё не имеете понятия о классах и идентификаторах, не волнуйтесь, все они объяснены в промежуточном руководстве по CSS. Всё, что вам нужно помнить, это то, что span и div являются “бессмысленными” тегами.

HTML5 вводит ряд тегов, используемых для группировки блоков кода вместе и одновременного добавления смысла. Впрочем, они не являются заменой div тега. Для получения дополнительной информации о article, header, footer и не только, смотрите статью о разделении.

Страницы в тему:

Добавить комментарий