Синтаксис XHTML


При написании кода XHTML придерживаются того же синтаксиса, который характерен для HTML. При этом разница между HTML и XHTML состоит в наборе некоторых обязательных правил.

Правила XHTML следующие.

  1. Все теги и их атрибуты должны быть набраны в нижнем регистре (строчными символами).
  2. Значения любых атрибутов необходимо заключать в кавычки.
  3. Требуется закрывать все теги, даже такие, которым не сопоставлен закрывающий тег.
  4. Должна соблюдаться правильная вложенность тегов.
  5. Нельзя использовать сокращенные атрибуты тегов.
  6. Вместо атрибута name следует указывать id.
  7. Следует определять DTD (document type definition, описание типа документа) с помощью элемента <!DOCTYPE>.

Теги должны быть набраны в нижнем регистре

Это правило возникло из-за того, что XHTML чувствителен к регистру символов, поэтому для него теги <HR> и <hr> различаются. Чтобы не возникало путаницы, синтаксис принудительно заставляет указывать все теги, а также их атрибуты в нижнем регистре. В примере 3.1 приводится неверное использование тегов.

Пример 3.1. Ошибочное написание тегов


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>XHTML</title>
 </head>
 <BODY>
 <P>Lorem ipsum dolor sit amet...</P>
 </BODY>
</html>


В данном примере теги <body> и <p> набраны прописными символами, что является ошибкой. В примере 3.2 показан корректный код.

Пример 3.2. Правильное написание тегов


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>XHTML</title>
 </head>
 <body>
 <p>Lorem ipsum dolor sit amet...</p>
 </body>
</html>


Значения любых атрибутов необходимо заключать в кавычки

Хотя в HTML также требуется заключать значения в кавычки, но их отсутствие никак не влияет на корректность кода. Так что можно сказать, что в HTML применение кавычек это лишь рекомендация. В XHTML же использование кавычек возведено в правило и любые значения атрибутов требуется указывать только в них (пример 3.3).

Пример 3.3. Использование кавычек


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>XHTML</title>
 </head>
 <body>
 <table width="200" border="1" cellpadding="5" cellspacing="0">
 <tr>
 <th scope="col">Чебурашка</th>
 <th scope="col">Шапокляк</th>
 </tr>
 <tr>
 <td>1</td>
 <td>5</td>
 </tr>
 <tr>
 <td>4</td>
 <td>13</td>
 </tr>
 </table>
 </body>
</html>


В данном примере все атрибуты тега <table>, а также <th> задаются в кавычках.

Требуется закрывать все теги

В HTML теги делятся на две категории — парные теги, называемые еще контейнерами и одинарные теги. Парные теги состоят из открывающего и закрывающего тега, причем в некоторых случаях закрывающий тег можно опустить. В XHTML закрывающий тег требуется всегда и везде. В примере 3.4 показан код с ошибкой, из-за того, что отсутствует тег </p>.

Пример 3.4. Нет закрывающего тега


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>XHTML</title>
 </head>
 <body>
 <p>и лезет, крадучись, в самолёт,
 <p>и бомбу в брюхо ему кладёт,
 <p>и прочь неслышно бежит, как кот;
 <p>а дальше - не наше дело.
 </body>
</html>


Некоторые разработчики игнорируют закрывающие теги </li></p></td>, но в XHTML их отсутствие считается ошибкой. В примере 3.5 показано корректное использование списков.

Пример 3.5. Добавление списка


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>XHTML</title>
 </head>
 <body>
 <ul>
 <li>Восток</li>
 <li>Запад</li>
 <li>Юг</li>
 <li>Север</li>
 </ul>
 </body>
</html>


В данном примере каждому открывающему тегу соответствует его закрывающий тег.

Элемент <!DOCTYPE> не является частью XHTML-документа, поэтому для него закрывающего тега не требуется.

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

Пример 3.6. Добавление изображения


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>XHTML</title>
 </head>
 <body>
 <p><img src="images/test.png" width="48" height="48" alt="тестовая картинка" /></p>
 </body>
</html>


В данном примере обратите внимание на обязательный пробел, который предшествует конструкции />.

В табл. 3.1 приведены некоторые теги HTML и их запись в XHTML-документе.

Табл 3.1. Сопоставление HTML и XHTML-тегов
HTML-тегXHTML-тег
<br><br />
<hr><hr />
<input><input />
<img><img />
<meta><meta />

Должна соблюдаться правильная вложенность тегов

XHTML критично относится к ошибкам следующего типа: некорректная вложенность одного тега в другой и расположение тега в несоответствующем контейнере.

Правильная вложенность тегов

Каждый тег должен располагаться внутри другого тега, при этом недопустимо их «пересечение», как это показано в примере 3.7.

Пример 3.7. Ошибка с положением тегов


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>XHTML</title>
 </head>
 <body>
 <p>Lorem <b><i>ipsum dolor sit</b></i> amet...</p>
 </body>
</html>


В данном примере закрывающий тег </b> предшествует тегу </i>, хотя должно быть наоборот, что и приводит к ошибке. Стоит поменять теги местами, как код становится корректным.

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

Иерархия тегов

Все теги имеют строгую иерархическую систему в том смысле, что каждый тег должен находиться внутри другого тега и никак иначе. На условной вершине находится корневой элемент <html>, а все остальные теги могут содержать внутри себя другие теги, которые называются дочерними. Соответственно дочерние теги располагаются в родительском элементе.

Необходимо знать систему подчиненности тегов и следовать ей при написании кода XHTML. В примере 3.8 показана базовая структура документа.

Пример 3.8. Структура документа


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>Новый документ</title>
 </head>
 <body>
 <p>...</p>
 </body>
</html>


В данном примере вначале приводится тег <html>, внутри которого располагаются теги <head> и <body>. Внутри раздела <head> хранится заголовок документа (<title>) и кодировка страницы (<meta>).

Нельзя использовать сокращенные атрибуты тегов

Сокращенным называется атрибут без присвоенного значения. В примере 3.9 приведена форма с использованием таких атрибутов.

Пример 3.9. Ошибка при использовании атрибутов


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>XHTML</title>
 </head>
 <body>
 <form action="handler.php" method="post">
 <fieldset>
 <input type="text" value="Совет дня" readonly />
 </fieldset>
 </form>
 </body>
</html>




Радио

Вконтакте

Последнии комментарии


а еще запретить продажу програм фирмы 1с во всех ее проявлениях. будь то игра или программы учета!!!



Answer: Благодарим за информацию.


Не плохая идея но дорого будет стоить будет дорого наверное



Сюся, если еще сравнивать эту  соц. сеть с сетью "Друзи" то это же вообще пипец полный! Не говоря что не кто не переманит пользователей с ВК.

Наш опрос

Нужна ли нам группа?


Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0