<!DOCTYPE html>
<html>
<head>
<title>Kurs HTML</title>
</head>
<!-- początek głównej części strony -->
<body>
<p>treść strony</p> 
</body>
</html>

<!DOCTYPE html> - deklaracja typu dokumentu definiuje poziom i wersję użytego kodu HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> - Dokument w HTML 4.01 Strict DTD - kod ścisły nie zawierający elementów i atrybutów zdeprecjonowanych (nie zalecanych lub przeznaczonych do usunięcia w wersjach kolejnych) oraz nie zawierający ramek
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> - Dokument HTML 4.01 Transitional DTD - kod przejściowy lub inaczej luźny. Zawiera to co w Strict DTD oraz elementy zdeprecjonowane i element IFRAME
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"> - Dokument HTML 4.01 Frameset DTD - kod zawierający elementy dopuszczane przez Transitional DTD oraz elementy odnoszące się do ramek

 

<!DOCTYPE html> - deklaracja typu dokumentu w HTML 5

Deklaracje dla XHTML 1.0 (wersje Strict, Transitional i Frameset)

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

Wersja najaktualniejsza. Restrykcyjność jak w XHTML 1.0, ale dopuszczająca dodawanie modułów rozszerzających:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html>...</html> - znacznik, który można traktować jako klamrę zamykającą cały kod HTML

W XHTML wymagany jest atrybut dla tego znacznika:

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

<head>...</head> - nagłówek strony zawierający elementy informacyjne na temat strony. Tytuł, opis strony, linki do stylów CSS, strona kodowa strony itd. Może zawierać następujące parametry:

dir - Kierunek tekstu <html lang="he" dir="rtl">
lang - Kod języka np: <html lang="en-GB">
xml:lang - Kod języka dla XHTML np: <html lang="fr" xml:lang="fr">

<body>...</body> - zawiera treść strony. Cały tekst, grafikę, menu itd. Można stosować następujące atrybuty:

Atrybuty niezalecane w HTML 4.01 i niewspierane przez XHTML.
alink - Określa kolor aktywnych linków w dokumencie.
background - Adres obrazka który ma zostać użyty jako tło strony.
bgcolor - Kolor tła w dokumencie HTML.
link - Określa kolor wszystkich linków w dokumencie.
text - Kolor tekstu na stronie.
vlink - Określa kolor odwiedzonych linków w dokumencie.

 

Atrybuty wspierane przez XHTML.
class - Klasa CSS (lub lista klas) elementu
id - Unikalny identyfikator elementu
style - Styl elementu (inline)
title - Tekst do wyświetlenia jako Tooltip po najechaniu myszką    
dir - Kierunek tekstu
lang - Kod języka
xml:lang - Kod języka dla XHTML
onload - Skrypt do uruchomienia po załadowaniu dokumentu
onunload - Skrypt do uruchomienia w momencie gdy dokument jest odładowywany
onclick - Co zrobić po kliknięciu myszą
ondblclick - Co zrobić po podwójnym kliknięciu myszą
onmousedown - Co zrobić po naciśnięciu klawisza myszy
onmousemove - Co zrobić w momencie gdy kursor myszki jest przesuwany
onmouseout - Co zrobić gdy kursor myszki opuszcza element
onmouseover - Co zrobić gdy kursor myszki najeżdża na element
onmouseup - Co zrobić po zwolnieniu klawisza myszki    
onkeydown - Co zrobić gdy klawisz zostanie naciśnięty
onkeypress - Co zrobić gdy klawisz zostanie naciśnięty i zwolniony
onkeyup - Co zrobić gdy klawisz zostanie zwolniony

<!--...--> - komentarz. Nie jest on obowiązkowy i nie wyświetla się na stronie. Warto go jednak stosować przy większych stronach by łatwiej orientować się we fragmentach kodu

Po uzupełnieniu o poznane atrybuty nasz fragment kodu może wyglądać tak:

<!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 lang="pl" xml:lang="pl" dir="ltr">
<title>Kurs HTML</title>
</head>
<body style="color:white;background-color:black;">
<p>treść strony</p>
</body>
</html>

reveal-a

reveal-a

×

reveal-b

reveal-b

×

reveal-c

reveal-c

×