XHTML - składnia

Składnia XHTML jest bardzo podobna do składni HTML i prawie wszystkie prawidłowe elementy HTML są również poprawne w XHTML. Ale kiedy piszesz dokument XHTML, musisz poświęcić nieco więcej uwagi, aby dokument HTML był zgodny z XHTML.

Oto ważne punkty, o których należy pamiętać podczas pisania nowego dokumentu XHTML lub konwersji istniejącego dokumentu HTML do dokumentu XHTML -

  • Napisz deklarację DOCTYPE na początku dokumentu XHTML.

  • Zapisuj wszystkie znaczniki i atrybuty XHTML tylko małymi literami.

  • Zamknij poprawnie wszystkie tagi XHTML.

  • Zagnieźdź poprawnie wszystkie tagi.

  • Cytuj wszystkie wartości atrybutów.

  • Zabroń minimalizacji atrybutów.

  • Zastąp name atrybut z id atrybut.

  • Wycofaj language atrybut tagu script.

Oto szczegółowe wyjaśnienie powyższych reguł XHTML -

Deklaracja DOCTYPE

Wszystkie dokumenty XHTML muszą mieć deklarację DOCTYPE na początku. Istnieją trzy typy deklaracji DOCTYPE, które są szczegółowo omówione w rozdziale XHTML Doctypes. Oto przykład użycia DOCTYPE -

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

Rozróżnianie wielkości liter

XHTML jest językiem znaczników uwzględniającym wielkość liter. Wszystkie znaczniki i atrybuty XHTML muszą być zapisane tylko małymi literami.

<!-- This is invalid in XHTML -->
<A Href="/xhtml/xhtml_tutorial.html">XHTML Tutorial</A>

<!-- Correct XHTML way of writing this is as follows -->
<a href="/xhtml/xhtml_tutorial.html">XHTML Tutorial</a>

W przykładzie Href i tag kotwicy A nie są pisane małymi literami, więc jest to nieprawidłowe.

Zamykanie tagów

Każdy znacznik XHTML powinien mieć równoważny znacznik zamykający, nawet puste elementy powinny mieć również znaczniki zamykające. Oto przykład pokazujący prawidłowe i nieprawidłowe sposoby używania tagów -

<!-- This is invalid in XHTML -->
<p>This paragraph is not written according to XHTML syntax.

<!-- This is also invalid in XHTML -->
<img src="/images/xhtml.gif" >

Poniższa składnia przedstawia poprawny sposób pisania powyższych znaczników w XHTML. Różnica polega na tym, że tutaj poprawnie zamknęliśmy oba tagi.

<!-- This is valid in XHTML -->
<p>This paragraph is not written according to XHTML syntax.</p>

<!-- This is also valid now -->
<img src="/images/xhtml.gif" />

Cytaty atrybutów

Wszystkie wartości atrybutów XHTML muszą być cytowane. W przeciwnym razie twój dokument XHTML jest uznawany za nieprawidłowy. Oto przykład przedstawiający składnię -

<!-- This is invalid in XHTML -->
<img src="/images/xhtml.gif" width=250 height=50 />

<!-- Correct XHTML way of writing this is as follows -->
<img src="/images/xhtml.gif" width="250" height="50" />

Minimalizacja atrybutów

XHTML nie pozwala na minimalizację atrybutów. Oznacza to, że musisz jawnie określić atrybut i jego wartość. Poniższy przykład pokazuje różnicę -

<!-- This is invalid in XHTML -->
<option selected>

<!-- Correct XHTML way of writing this is as follows -->
<option selected="selected">

Oto lista zminimalizowanych atrybutów w HTML i sposób, w jaki należy je zapisać w XHTML -

Styl HTML Styl XHTML
kompaktowy compact = "compact"
sprawdzone zaznaczone = "zaznaczone"
ogłosić deklaruj = "deklaruj"
tylko czytać readonly = "readonly"
wyłączone disabled = "disabled"
wybrany selected = „wybrane”
odraczać defer = "odrocz"
ismap ismap = "ismap"
nohref nohref = "nohref"
noshade noshade = "noshade"
nowrap nowrap = "nowrap"
wielokrotność multiple = "wiele"
noresize noresize = "noresize"

ID Atrybut

Atrybut id zastępuje atrybut nazwy. Zamiast używać name = "name", XHTML woli używać id = "id". Poniższy przykład pokazuje, jak -

<!-- This is invalid in XHTML -->
<img src="/images/xhtml.gif" name="xhtml_logo" />

<!-- Correct XHTML way of writing this is as follows -->
<img src="/images/xhtml.gif" id="xhtml_logo" />

Język Atrybut

Atrybut języka znacznika script jest przestarzały. Poniższy przykład pokazuje tę różnicę -

<!-- This is invalid in XHTML -->

<script language="JavaScript" type="text/JavaScript">
   document.write("Hello XHTML!");
</script>

<!-- Correct XHTML way of writing this is as follows -->

<script type="text/JavaScript">
   document.write("Hello XHTML!");
</script>

Zagnieżdżone znaczniki

Musisz poprawnie zagnieżdżać wszystkie znaczniki XHTML. W przeciwnym razie twój dokument zostanie uznany za niepoprawny dokument XHTML. Poniższy przykład przedstawia składnię -

<!-- This is invalid in XHTML -->
<b><i> This text is bold and italic</b></i>

<!-- Correct XHTML way of writing this is as follows -->
<b><i> This text is bold and italic</i></b>

Zakazy dotyczące elementów

Następujące elementy nie mogą mieć w sobie żadnego innego elementu. Zakaz ten dotyczy wszystkich głębokości gniazdowania. Znaczy, zawiera wszystkie zstępujące elementy.

Element Zakaz
<a> Nie może zawierać innych elementów <a>.
<pre> Nie może zawierać elementów <img>, <object>, <big>, <small>, <sub> ani <sup>.
<button> Nie może zawierać elementów <input>, <select>, <textarea>, <label>, <button>, <form>, <fieldset>, <iframe> ani <isindex>.
<label> Nie może zawierać innych elementów <label>.
<form> Nie może zawierać innych elementów <form>.

Minimalny dokument XHTML

Poniższy przykład przedstawia minimalną zawartość dokumentu XHTML 1.0 -

<?xml version="1.0" encoding="UTF-8"?>

<!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/TR/xhtml1" xml:lang="en" lang="en">
   <head>
      <title>Every document must have a title</title>
   </head>
	
   <body>
      ...your content goes here...
   </body>
</html>