|
Синтаксис xHTMLПри написании кода XHTML придерживаются того же синтаксиса, который характерен для HTML. При этом разница между HTML и XHTML состоит в наборе некоторых обязательных правил. Правила XHTML следующие.
Теги должны быть набраны в нижнем регистреЭто правило возникло из-за того, что XHTML чувствителен к регистру символов, поэтому для него теги <HR> и <hr> различаются. Чтобы не возникало путаницы, синтаксис принудительно заставляет указывать все теги, а также их параметры в нижнем регистре. В примере 3.1 приводится неверное использование тегов. Пример 3.1. Ошибочное написание тегов <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" В данном примере теги <body> и <p> набраны прописными символами, что является ошибкой. В примере 3.2 показан корректный код. Пример 3.2. Правильное написание тегов <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" Замечание В дальнейшем при упоминании какого-либо тега, обычно будем указывать его прописными символами для акцентирования внимания. Но при этом в примерах теги всегда приводятся в нижнем регистре. Значения любых параметров необходимо заключать в кавычкиХотя в HTML также требуется заключать аргументы в кавычки, но их отсутствие никак не влияет на корректность кода. Так что можно сказать, что в HTML применение кавычек лишь рекомендация. В XHTML же использование кавычек введено в правило и любые значения параметров требуется указывать только в них (пример 3.3). Пример 3.3. Использование кавычек <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" В данном примере все параметры тега <TABLE>, а также <TH> задаются в кавычках. Требуется закрывать все тегиВ HTML теги делятся на две категории ? парные теги, называемые еще контейнерами и одинарные теги. Парные теги состоят из открывающего и закрывающего тега, причем в некоторых случаях закрывающий тег можно опустить, поскольку браузер добавляет его автоматически. В XHTML закрывающий тег требуется всегда и везде. В примере 3.4 показан код с ошибкой, из-за того, что отсутствует тег </p>. Пример 3.4. Нет закрывающего тега <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" Обычно разработчики игнорируют закрывающие теги </li>, </p>, </td>, но в XHTML их отсутствие считается ошибкой. В примере 3.5 показано корректное использование списков. Пример 3.5. Добавление списка <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" В данном примере каждому открывающему тегу соответствует его закрывающий тег. Замечание Тег <!DOCTYPE> не является частью XHTML-документа, поэтому для него закрывающего тега не требуется. Что касается одинарных тегов, то они должны завершаться слэшем перед закрывающей угловой скобкой, как показано в примере 3.6. Пример 3.6. Добавление изображения <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" В данном примере обратите внимание на обязательный пробел, который предшествует конструкции />. В табл. 3.1 приведены некоторые теги HTML и их запись в XHTML-документе.
Должна соблюдаться правильная вложенность теговXHTML критично относится к ошибкам следующего типа: некорректная вложенность одного тега в другой и расположение тега в несоответствующем контейнере. Правильная вложенность теговКаждый тег должен располагаться внутри другого тега, при этом недопустимо их ?пересечение?, как это показано в примере 3.7. Пример 3.7. Ошибка с положением тегов <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" В данном примере закрывающий тег </b> предшествует тегу </i>, хотя должно быть наоборот, что и приводит к ошибке. Стоит поменять теги местами, как код становится корректным. Замечание Хотя валидатор кода и выдает ошибку в случае неправильного положения тегов, браузеры при этом правильно отображают веб-страницу. Иерархия теговВсе теги имеют строгую иерархическую систему в том смысле, что каждый тег должен находиться внутри другого тега и никак иначе. На условной вершине находится корневой элемент <HTML>, а все остальные теги могут содержать внутри себя другие теги, которые называются дочерними. Соответственно дочерние теги располагаются в родительском элементе. Необходимо знать систему подчиненности тегов и следовать ей при написании кода XHTML. В примере 3.8 показана базовая структура документа. Пример 3.8. Структура документа <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" В данном примере вначале приводится тег <HTML>, внутри которого располагаются теги <HEAD> и <BODY>. Внутри раздела <HEAD> хранится заголовок документа (<TITLE>) и кодировка страницы (<META>). Замечание Параметр xmlns требуется добавлять к тегу <HTML>. Вместе с тем, его отсутствие никак не влияет на выдачу результата валидатора. Это связано с тем, что браузеры вставляют этот параметр автоматически. Нельзя использовать сокращенные атрибуты теговСокращенным атрибутом называется параметр без присвоенного значения. В примере 3.9 приведена форма с использованием таких атрибутов. Пример 3.9. Ошибка при использовании параметров <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" ?Пустое значение?, как еще называется подобная ошибка, легко исправляется, если присвоить параметру значение 1 или аргумент, совпадающий с названием атрибута. В табл. 3.2 приведены некоторые параметры и как они записываются в HTML и XHTML.
В примере 3.10 показано корректное использование вышеприведенной формы. Пример 3.10. Правильное использование параметров <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" Вместо параметра name необходимо указывать атрибут idПараметр name определяется в HTML для тегов <A>, <FRAME>, <IFRAME>, <IMG> и <MAP> и предназначен для обозначения элемента с целью последующего к нему обращения. В XHTML параметр name вышел из употребления, а вместо него следует использовать id, как показано в примере 3.11. Пример 3.11. Идентификатор рисунка <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" Следует определять DTDВсе XHTML-документы обязательно должны содержать тег <!DOCTYPE>, который задает DTD, а также придерживаться иерархической структуры вложения тегов. |
| Сделано в студии ladoga-design.ru |