Пример XHTML верстки сайта

Рассмотрим простейший способ верстки web-страниц

Подведем итоги.

Внизу представлен один из возможных результатов первых одиннадцати уроков нашего HTML курса. Вы, уважаемый читатель, спросите: Почему в заголовке написано Пример XHTML верстки?
Ответ такой: Потому что XHTML является расширенной и более модной версией HTML (смотрите также 5 версию), и некоторые его элементы уже были нами использованы в предыдущих уроках, а теперь пришло время познакомиться с ним поближе на конкретном примере.

Итак, пример XHTML верстки сайта:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

          <html xmlns="http://www.w3.org/1999/xhtml">

          <head>

          <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />

          <title>XHTML верстка</title>

          </head>

          <body style="background-color:#ffffcc; color:#008800">

          <br />

          <h2 align="center">Пробная XHTML страничка</h2>

          <br />

          <div align="center">

          <img src="../images/bee3.jpg" width="400" height="250" alt="Пчела на цветке" vspace="20" />

          </div>

          <p align="center" style="font-size:17px">Среди полей и диких трав,<br />

          Жужжа на встречу ветру,<br />

          Она летит, свой дикий нрав<br />

          Вплетая в песню лета.</p>

          <p align="center"><em>Эргэл</em></p>

          <br />

          <hr />

          </body>

          </html>

Результат: XHTML верстка

Обратите внимание на структуру XHTML документа, то есть на содержимое тегов <!DOCTYPE>, <html> и на то, как было отцентрированo изображение – с помощью <div> </div>, так как атрибут align="" тега <img /> не имеет значения center. Остальное думаю понятно – не зря же мы предыдущие 11 уроков прошли!

Автор проекта - Вася Митин | Дата публикации: Октябрь 2009 | Обновление: Ноябрь 2018

HTML изображение и текст XHTML верстка сайта HTML ссылки