Изучаем теги div span

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

Начнём с того что это теги логического уровня и они сами по себе никак себя не проявляют, в этом мы можем убедится если возьмём и заключим в тег div например абзац:

<div><p>Это абзац</p></div>

И если мы посмотрим в браузере на этот абзац заключённый в тег div, то ничего и не увидим кроме самого абзаца, та же история и с тегом span. Зачем же нужны тогда эти теги спросите вы, а я вам отвечу вот что: Теги div span можно представить как некие контейнеры, они сами по себе как мы выше уже узнали не видимы, но мы можем воздействовать на эти теги, как же мы можем воздействовать на эти теги?, да вы уж наверно и сами догадались как, да правильно, через CSS.

Что мы можем сделать например тому же абзацу заключенному в тег div?, ну самое простое что мы с ним можем сотворить, та это задать ему определённую ширину, в уроках по css мы это не раз ещё увидим, еще мы можем изменить этому divному абзацу цвет, можем сделать его вообще совершенно не видимым, можем сделать ему рамку какую угодно, короче со всем что заключено тег div, мы можем творить всё что угодно. 

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

Теперь идём дальше, есть еще один подобный divу тег, это span, он в свою очередь предназначен как бы для внутренней работы над текстом. Spanом обычно пользуются для того чтобы изменить какую нибудь часть текста или предложение, в общем при помощи того же css мы можем влиять на внешний вид текстового содержимого через тег span. Чтобы вам было более понятно, я могу уточнить, все отделочные теги которые вы знаете в хтмле, такие как strong, em, u и так далее, многие сейчас уже заменяют тегом span, заключают необходимый в него текст и через стили придают нужный класс.

Короче для чего я вообще завёл эту бадью и вспомнил эти теги div span, а для того, что сейчас в идеале html, должен использоваться только раде создания каркаса сайта, в каркас сайта входят не обходимые мета теги еще там пару мелочей, абзацы, ну и всё, остальное мы должны уже делать через css, поэтому div span, как говориться нам в помощь.

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

Ну вот наверное и всё что я хотел поведать вам в сегодняшнем уроке, до скорых встреч.