..:: Kurs języka XHTML ::..
Wstęp
Co to jest XHTML?
XHTML (eXtensible HyperText Markup Language) to język hipertekstowy
używany do tworzenia dokumentów czyli stron internetowych. Polecenia
tekstowe (znaczniki i atrybuty) pozwalają na realizację tzw. linków (odsyłaczy),
wyświetlanie różnych czcionek, grafiki i innych elementów.
Definicja ta pasuje nie tylko do XHTML ale także do HTML. To nie przypadek, że
definicje są podobne (a właściwie takie same). Obydwa języki pełnią taką samą
funkcję.
Po co mi XHTML?
Te pytanie nasuwa się wszystkim webmasterom, którzy stykają się z XHTML
Odpowiedź jest prosta. XHTML jest aktualnie obowiązującym standardem
opisu stron WWW zalecanym przez W3C. XHTML należy traktować jako
stanadard "HTML 5" (co oczywiście nie jest prawdą, ponieważ prace nad
rozwijaniem języka HTML zostały zakończone na wersji 4.01). Wcześniej czy
później wszystkie strony będą zgodne z tym standardem.
XHTML jest także zgodny z XML, który staje się uniwersalnym standardem
przetwarzania opisu środowiska WWW i dokumentów strukturalnie
uporządkowanych informacji.
XHTML jest ściśle związany z kaskadowymi stylami - CSS1 i CSS2, w
przyszłości także - CSS3.
Przeglądarki XHTML
Większość przeglądarek dokumentów HTML dobrze interpretuje XHTML. Są to
przeglądarki: Netscape Communicator/Sylaba Komunikator/Mozilla, Microsoft
Internet Explorer, Opera, Konqueror i inne. Należy pamiętać, że im nowsza
przeglądarka tym lepiej będzie interpretować XHTML. Nawiasem mówiąc (czytaj
pisząc:-) najlepiej widać strony XHTML pod IE w wersji 4, 5, 6 i Netscape 6, 7,
Mozilla 0.9.x i 1.0. NC 4.xx (NN, Sylaba) gorzej obsługuje style. Ciekawą
alternatywą jest Opera (szczególnie Opera 5 i 6), która działa szybko i sprawnie.
Jak widać problemy sprawiają style, które są nieodłącznym elementem XHTML.
Informacje ogólne
Podobieństwa z HTML
Dane są w formie tekstowej
Dane opisywane są znacznikami (tagami) np: <img>
Znaczniki mogą posiadać atrybuty np: src="przyk.gif"
Atrybuty posiadają wartości (przykład jak wyżej)
Tagi rozpoczynają się znakiem '<'a kończą '>' np: <html>
Przykład zamknięcia znacznika (jeśli jest wymagany) </html>
Wartości zawarte są w symbolach "" np: "przyk.gif"
A oto przykładowy dokument HTML (także w pewnym sensie XHTML):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
"http://www.w3.org/TR/REC-html40/strict.dtd">
<html>
<head>
<title>Przypładowa strona</title>
</head>
<body>
<p>To tylko przykład</p>
<img src="przyk.gif">
<body>
</html>
Bardzo początkujących (nie znających HTML i nie rozumiejących składni
języka) zapraszam na świetny kurs Pawła Wimmera: http://www-
mag.com.pl/kurs/
Nowości w stosunku do HTML
Znaczniki niepuste mają zawsze znacznik końcowy np: <p>Coś tam</p>
Znaczniki puste muszą być zawsze zakończone '/>' np: <br />
Wszystkie atrybuty i tagi muszą być pisane małymi literami np: <img
src="przyk.gif">
Atrybuty typu boolean (logiczne) muszą być uzupełniane o wartość np:
noshade="noshade"
Wartości atrybutów muszą być zawarte w symbolach (nawet te jedno
wyrazowe) "" np: "przyk.gif"
Zlikwidowano znaczniki (dotyczy też HTML 4, patrz: 'Znaczniki'):
<font> - należy używać stylów
<basefont> - należy używać stylów
<strike> - należy używać stylów
<s> - należy używać stylów
<u> - należy używać stylów
<center> - należy używać stylów i znacznika <div>
<menu> - należy używać znacznika <ul>
<dir> - należy używać znacznika <ul>
<isindex> - należy używać znacznika <input>
<xmp> - należy używać znacznika <pre>
<plaintext> - należy używać znacznika <pre>
<listing> - należy używać znacznika <pre>
<applet> - należy używać znacznika <object> (dotyczy tylko XHTML 1.0)
Zlikwidowano atrubuty (dotyczy też HTML 4, patrz: 'Atrybuty'):
accesskey
align (uwaga: można używać w <col>, <colgroup>, <tbody>, <td>, <tfoot>, <th>,
<thead>, <tr>)
alink
background
bgcolor
border (uwaga: można używać w <table>)
clear
color
compact
face
height (uwaga: można używać w <iframe>, <img>, <object> ale się nie zaleca)
hspace
lang
language (należy używać type="text/javascript" w znaczniku <script>)
link
name (zlikwidowano w <a> i <map>)
size (uwaga: można używać w <input>, <select>
start
tabindex
target (zlikwidowano w <a>, <area> i <link>)
text
type
value
version
vlink
vspace
width (uwaga: można używać w <colgroup>, <col>, <table>, <img>, <object>,
<iframe> ale się nie zaleca)
Wszystkie atrybuty wymienione wyżej należy zastąpić stylami chyba, że jest to
zaznaczone w nawiasie
Między znacznikami <table> musi znajdować się tag <tbody> np:
<table><tbody><tr><td></td></tr></tbody></table>, jeśli tabela jest długa
należy stosować znaczniki <thead> i/lub <tfoot>
Pomimo, że tagi takie jak <b>, <i> znajdują się w specyfikacji to zaleca się
stosowanie stylów. W przyszłości wszystkie atrybuty i znaczniki opisujące pod
względem wizualnym stronę zostaną zlikwidowane. Atrybuty wymienione
wyżej, które teraz można używać z niektórymi tagami w przyszłości zostaną
zlikwidowane (np: size, width, height, border, align).
Przy znaczniku <img> należy używać atrybutu 'alt'.
Więcej nowych cech znajduje się w dalszych częściach kursu (patrz: 'Inne
ważne zasady').
Większość cech wymienionych wyżej nie związanych z HTML pochodzi z XML.
Więcej informacji o XML znajduje się na stronie Pawła Stroińskiego.
A oto przykład dokumentu XHTML:
<?xml version="1.0" encoding="iso-8859-2"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-2" />
<title>Przypładowa strona</title>
</head>
<body>
<p>Oto przykład</p>
<hr />
<img src="przyk.gif" alt="tekst" />
</body>
</html>
Specyfikacja XHTML
Co to jest specyfikacja?
Specyfikacja to pełny zbiór zasad i reguł dotyczących danego języka np.
XHTML, HTML, SVG itp. Specyfikacja jest ustalana przez specjalistów z danej
dziedziny (w tym przypadku ludzi z W3C), wytycza ona drogi rozwoju dla
języków. Specyfikacja XHTML jest napisana w języku angielskim (występuje w
niej wiele specjalistycznych wyrażeń) a co za tym idzie jest trudna do
zrozumienia. Ten kurs w poszczególnych rozdziałach przedstawia zasady
zawarte w specyfikacji napisane prostym językiem (i jak widać po polsku:-).
Część informacji zawartych w tym kursie nie występuje w specyfikacji XHTML
ale jest równie ważna (czasami są one zawarte w innych specyfikacjach
zgodnych z XHTML np. w XML, inne zaś są rodzajami reguł ogólnie przyjętych
zgodnych oczywiście ze specyfikacjami).
Specyfikacja HTML
XHTML jest bardzo podobny do HTML i XML. Specyfikacja XHTML nie zawiera
opisu znaczników i atrybutów, ponieważ jest to zawarte w specyfikacji HTML
4.01 (patrz: 'Informacje ogólne', 'Znaczniki' i 'Atrybuty'). Specyfikacja HTML
4.01 jest poprawioną i uzupełnioną wersją specyfikacji HTML 4.0. HTML jest
uproszczoną wersją metajęzyka SGML.
Specyfikacja HTML 4.01: http://www.w3.org/TR/html401
Specyfikacja XHTML i XML
Specyfikacja XHTML zawiera reguły, które są związane z XML. Inaczej mówiąc
(właściwie pisząc:-) XHTML jest odmianą języka HTML przeformatowanego do
metajęzyka XML. XHTML jest więc zgodny XML, który w przyszłości stanie się
standardem przechowywania informacji nie tylko stron internetowych. Od
niedawna pojawiła się uproszczona wersja XHTML - Basic XHTML (patrz: 'Basic
XHTML').
Scecyfikacja XML: http://www.w3.org/TR/REC-xml/
Specyfikacja XHTML 1.0: http://www.w3.org/TR/xhtml1/
Specyfikacja XHTML 1.1: http://www.w3.org/TR/xhtml11/
Specyfikacja Basic XHTML: http://www.w3.org/TR/xhtml-basic/
Większość informacji ze specyfikacji dotyczących XHTML jest zawarte w tym
kursie (a niektórych informacji nawet nie znajdziesz w specyfikacji).
Specyfikacja CSS
Osoby znające HTML i XML nie będą mieli żadnych problemów z opanowaniem
języka XHTML (pozostali będą się musieli trochę pomęczyć, ale zapewniam, że
XHTML to prosty język:-). Niestety sam XHTML nie wystarczy, trzeba znać style
kaskadowe, które zajmują się formatowaniem i upiększaniem stron (tzw. Strona
napisana w czystym XHTML wygląda niezbyt ładnie). Jeśli ktoś miał wcześniej
styczność z CSS1 nie będzie miał problemu z opanowaniem CSS2, ponieważ
obydwie specyfikacje są do siebie bliźniaczo podobne. Większość
dokumentów zgodnych z CSS1 jest zarówno zgodne z CSS2. Specyfikacja
CSS2 nie jest nowa, była już zalecana do HTML (patrz: 'Style w XHTML'). Do
mniej skomplikowanych dokumentów wystarczy nawet CSS1. Ostatnio
prowadzone są prace nad CSS3. Warto pamiętać, że CSS2 nie jest jeszcze w
pełni interpretowany przez przeglądarki a CSS3 to zupełna nowość.
Specyfikacja CSS2: http://www.w3.org/TR/REC-CSS2/
Specyfikacja CSS1: http://www.w3.org/TR/REC-CSS1/
Wszystkie ważne zagadnienia dotyczące XHTML, HTML, XML, CSS1, CSS2
znajdziecie na tej stronie. Bardziej szczegółowe informacje o HTML, XML i CSS
znajdziecie w EduWebie (więc nie martwcie się jeśli nie znacie języka
angielskiego:-).
Wersje DTD
W XHTML 1.0 istnieją trzy wersje DTD czyli definicje typu dokumentu:
'transitional', 'strict', 'frameset'. Wersje te pozwalają na poprawną walidację
tzw. sprawdzenie poprawności dokumentu XHTML.
Transitional
Transitional to najczęściej stosowana wersja DTD. Jest swego rodzaju formą
przejściową pomiędzy HTML a XHTML, ponieważ zezwala na korzystanie ze
znaczników i atrybutów w statusie deprecated (takich jak <applet>, <font>, <s>,
align, width i innych wymienionych na stronie: 'Informacje ogólne'). W tej
wersji nie można stosować ramek.
Przykład:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Należy unikać 'Transitional', zaleca się stosowanie 'Strict'.
Strict
Strict jest to wersja DTD, do której wszyscy dążą. Jest bardzo trudna do
zrealizowania, ponieważ zabrania stosowania tagów i atrybutów w statusie
deprecated (patrz: 'Znaczniki' i 'Atrybuty') . Nie można w niej korzystać z ramek.
Przykład:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Frameset
Frameset to wersja DTD, która dopuszcza wszystkie elementy (czyli z
atrybutów i znaczników deprecated i ramek). Jak widać ta wersja podobna jest
do 'transitional'.
Przykład:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Należy unikać 'Frameset', zaleca się korzystanie z 'div' i CSS.
Wersja DTD XHTML 1.1
Do XHTML 1.1 zalecana jest następująca wersja DTD:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Wersja DTD XHTML 1.1 jest podobna do wersji XHTML 1.0 Strict. Nie wszystkie
jednak dokumenty XHTML 1.0 Scrict mogą być dokumentami XHTML 1.1. Po
wykonaniu strony WWW należy ją poddać walidacji i na podstawie wyników
zadeklarować wersję DTD (patrz: 'Linki i parsery').
Prolog i składnia
Prolog
W XHTML istnieją elementy, których nie można pominąć (jak np: HTML). Do
nich zalicza się deklaracja XML, wersja DTD i znacznik <html> z odpowiednimi
atrybutami. Pomaga to w klasyfikacji dokumentu i w jego walidacji. Prologu
należy używać zawsze na początku dokumentu. Prolog to zadeklarowanie
zgodności z XML. A wygląda tak:
<?xml version="1.0" encoding="iso-8859-2"?>
Pierwsza część prologu (czyli: <?xml version="1.0") nie zmienia się. Dalsza
część dotyczy kodowania znaków (w naszym przypadku polskich znaków).
Standard dla polskich "ogonków" to 'iso-8859-2' (ISO Latin 2). Należy zwrócić
uwagę na to, że version w prologu nie jest traktowane jako zwykły atrybut a
więc nie posiada statusu Deprecated (jako to ma miejsce w znaczniku <html>,
patrz: 'Atrybuty'). Do prologu można też dodać standalone z wartością "no".
Oznacza to, że definiujemy dokument z zewnętrzną definicją w innych plikach.
Przykład:
<?xml version="1.0" encoding="iso-8859-2" standalone="no"?>
Dalej należy wpisać wersje DTD dokumentu (patrz: 'Wersje DTD'). Deklaracja
XML i wersja DTD to prolog.
Przykład:
<?xml version="1.0" encoding="iso-8859-2"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Dokumenty zgodne z XHTML mogą nie posiadać deklaracji z XML ale jest to
bardzo odradzane.
Znacznik 'html'
W standardzie XHTML dokument jest zaczynany specyficznym tagiem <html>,
który w całości wygląda tak:
<html xmlns="http://www.w3.org/1999/xhtml">
Znacznik ten także ma podobne funkcje jak prolog.
Znacznik 'body'
Dobrym zwyczajem jest zadeklarowanie języka. Robi się to w znaczniku
<body>.
Przykład:
<body xml:lang="pl">
Podsumowując prawidłowy dokument powinien wyglądać tak:
<?xml version="1.0" encoding="iso-8859-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=iso-8859-2" />
<title></title>
</head>
<body xml:lang="pl">
</body>
</html>
Atrybut xml:lang="pl" można też wstawiać do znacznika <html>. W XHTML 1.0
można używać także atrybutu lang.
Oczywiście sekcje <head> i <body> można (nawet trzeba!) uzupełniać nowymi
znacznikami.
Dołączanie arkusza stylów
Dołączanie arkusza stylów w XML jest związane z prologiem (dotyczy to także
XHTML) i odbywa się w inny sposób niż w HTML. A oto przykład:
<?xml-stylesheet type="text/css" href="style.css"?>
W celu zachowania zgodności z HTML w dokumentach XHTML zaleca się
stosowanie górnego zapisu i równocześnie stosowanie znacznika <link>.
Przykład:
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
<?xml-stylesheet type="text/css" href="style.css" ?>
</head>
Dopuszcza się deklarowanie arkusza na samym początku dokumentu.
Przykład
<?xml version="1.0" encoding="iso-8859-2"?>
<?xml-stylesheet type="text/css" href="style.css" ?>
Znaczniki
Spis znaczników XHTML
Wybierz literę, na którą zaczyna się znacznik:
| g |
| w | x | y | z
Spis znaczników
Nazwa
znacznika
Opis znacznika
XHTML
1.0
XHTML 1.1
Zamknięcie
zanacznika
a odnośniki zgodny
zgodny
jest
abbr forma
skrócona zgodny
zgodny
jest
acronym akronim
zgodny
zgodny
jest
address dane
kontaktowe
zgodny
zgodny
jest
applet aplet
Javy
Deprecated
zgodny jest
area mapa
odnośników zgodny
zgodny
brak
b pogrubiony
tekst
zgodny
zgodny
jest
base adres
bazowy
zgodny
Unsupported brak
basefont czcionka
bazowa
Deprecated Unsupported brak
bdo
wyłączenie
dwustronnego
wypisywania
zgodny zgodny jest
big tekst
większy o 1
zgodny
zgodny
jest
blockquote
cytat do długich tekstów zgodny
zgodny
jest
body ciało dokumentu
zgodny
zgodny
jest
br nowa
linia
zgodny
zgodny
brak
button przyciski
zgodny
zgodny
jest
caption opis
tabeli
zgodny
zgodny
jest
center wyśrodkowanie
Deprecated Unsupported
jest
Spis znaczników
Nazwa
znacznika
Opis znacznika
XHTML
1.0
XHTML 1.1
Zamknięcie
zanacznika
cite cytat,
źródło zgodny
zgodny
jest
code kod
programu
zgodny
zgodny
jest
col
atrybuty kilku kolumn
zgodny
zgodny
brak
colgroup grupowanie
kolumn zgodny
zgodny jest
dd
termin w liście
definicyjnej
zgodny zgodny jest
del tekst
usunięty zgodny
zgodny
jest
dfn definicja
zgodny
zgodny
jest
dir zawartość katalogu
Deprecated
zgodny jest
div
wygląd długiego
fragmentu dokumentu
zgodny zgodny jest
dl
tworzenie listy
definicyjnej
zgodny zgodny jest
dt
termin w liście
definicyjnej
zgodny zgodny jest
em wyróżnienie tekstu
zgodny
zgodny
jest
fieldset
grupowanie elementów
formularza
zgodny zgodny jest
font czcionka
Deprecated Unsupported
jest
form tworzenie
formularzy
zgodny
zgodny
jest
frame zawartość ramki
Frameset
Unsupported brak
frameset wyglad
ramek
Frameset
Unsupported
jest
h1 nagłówek 1
zgodny
zgodny
jest
h2 nagłówek 2
zgodny
zgodny
jest
h3 nagłówek 3
zgodny
zgodny
jest
h4 nagłówek 4
zgodny
zgodny
jest
h5 nagłówek 5
zgodny
zgodny
jest
h6 nagłówek 6
zgodny
zgodny
jest
head nagłówek dokumentu
zgodny
zgodny
jest
hr linia
pozioma zgodny
zgodny
brak
html rozpoczyna
dokument
zgodny
zgodny
jest
i pochylony
tekst
zgodny
zgodny
jest
iframe ramki
wewnętrzne zgodny
Unsupported
jest
img obrazek
zgodny
zgodny
brak
input elementy
formularza
zgodny
zgodny
brak
ins wstawiony
tekst zgodny
zgodny
jest
Spis znaczników
Nazwa
znacznika
Opis znacznika
XHTML
1.0
XHTML 1.1
Zamknięcie
zanacznika
isindex
element wprowadzania
tekstu
Deprecated Unsupported brak
kbd tekst
do
wypisania
zgodny
zgodny
jest
label
etykieta opisu elementu zgodny
zgodny
jest
legend przypisanie
opisu zgodny
zgodny
jest
li
element listy
wyliczeniowej
zgodny zgodny jest
link odnośnik np. do stylów
zgodny
zgodny
brak
map definicja
mapy
odsyłaczy zgodny zgodny jest
menu lista
menu
Deprecated Unsupported
jest
meta
określanie własności
dokumentu
zgodny zgodny
brak
noframes
tekst dla przeglądarek
bez ramek
Frameset
Unsupported
jest
noscript
tekst dla przeglądarek
bez skryptów
zgodny zgodny jest
object obiekt
w
dokumencie
zgodny
Unsupported
jest
ol
tworzenie
uporządkowanej listy
zgodny zgodny jest
optgroup
logiczne grupowanie
opcji wyboru
zgodny zgodny jest
option opcja
listy
wyboru zgodny
zgodny
jest
p akapit
zgodny
zgodny
jest
param
parametr apletu lub
obiektu
zgodny zgodny jest
pre tekst
preformatowany
zgodny
zgodny
jest
q
cytat do krótkich tekstów zgodny
zgodny
jest
s przekreślony tekst
Deprecated Unsupported
jest
samp przykład zgodny
zgodny
jest
script skrypty
zgodny
zgodny
jest
select
tworzenie listy wyboru w
formularzach
zgodny zgodny jest
small
tekst mniejszy o 1
zgodny
zgodny
jest
span wygląd fragmentu tekstu zgodny
zgodny
jest
strike przekreślony tekst
Deprecated Unsupported
jest
strong wyróżnienie tekstu
zgodny
zgodny
jest
style definiowanie
stylów
zgodny
zgodny
jest
Spis znaczników
Nazwa
znacznika
Opis znacznika
XHTML
1.0
XHTML 1.1
Zamknięcie
zanacznika
sub indeks
dolny
zgodny
zgodny
jest
sup indeks
górny
zgodny
zgodny
jest
table tabela
zgodny
zgodny
jest
tbody
obszar głównej treści
tabeli
zgodny zgodny jest
td komórka
tabeli zgodny
zgodny
jest
textarea
wieloliniowy obszar
tekstu
zgodny zgodny jest
tfoot
obszar stopki tabeli
zgodny
zgodny
jest
th komórka
nagłówka tabeli zgodny
zgodny
jest
thead obszar
główka tabeli
zgodny
zgodny
jest
title tytuł dokumentu
zgodny
zgodny
jest
tr wiersz
tabeli zgodny
zgodny
jest
tt
tekst o tych samych
odstępach
zgodny zgodny jest
u podkreślony tekst
Deprecated Unsupported
jest
ul
tworzenie listy
wyliczeniowej
zgodny zgodny jest
var przykład zmiennej
zgodny
zgodny
jest
Deprecated
znaczniki w tym statusie nie mogą być używane w Strict (patrz: '
')
Frameset
znaczniki w tym statusie mogą być używane tylko w Frameset (patrz:
'
Unsupported
znaczniki w tym statusie nie mogą być używane w XHTML 1.1 (patrz:
'
Jak widać statusy deprecated i unsupported w większości znacznikach się
pokrywają, a co za tym idzie dokumenty zgodne ze strict w większości
(czasami z drobnymi zmianami) mogą być zgodne z XHTML 1.1.
Zasady dotyczące znaczników
<a>
w tym znaczniku nie może być zawarty inny znacznik <a>
<button>
w tym znaczniku nie może być zawarty <button>, <fieldset>, <form>,
<iframe>
, <input>, <isindex>, <label>, <select> i <textarea>
<form>
w tym znaczniku nie może być zawarty inny znacznik <form>
<label>
w tym znaczniku nie może być zawarty inny znacznik <label>
<pre>
w tym znaczniku nie może być zawarty <big>, <img>, <object>, <small>,
<sub>
i <sup>
Należy więc unikać zapisu takiego jak ten:
<pre><big>bvfbg</big></pre>
lub
<a href="xyz">xyz<a>abc</a></a>
Atrybuty
Spis atrybutów XHTML
Wybierz literę, na którą zaczyna się atrybut:
| g |
| j | k |
| x | y | z
Spis atrybutów
Nazwa Występowanie w znacznikach
XHTML 1.0
abbr td,
th
zgodny
accept-charset form
zgodny
accept form,
input
zgodny
accesskey
a, area, button, input, label, legend, textarea
+ zgodny
action form
zgodny
align
col, colgroup, tbody, td, tfoot, th, thead, tr
+ zgodny
align
caption, applet, iframe, img, input, object, legend,
table, hr, div, h1, h2, h3, h4, h5, h6, p
+
Deprecated
alink body
Deprecated
alt applet
Deprecated
alt area,
img,
input
zgodny
archive object
zgodny
archive applet
Deprecated
axis td,
th
zgodny
background body
Deprecated
bgcolor
table, tr, td, th, body
Deprecated
border table
+
zgodny
border img,
object
+ zgodny
Deprecated
Spis atrybutów
Nazwa Występowanie w znacznikach
XHTML 1.0
cellpadding table
zgodny
cellspacing table
zgodny
char
col, colgroup, tbody, td, tfoot, th, thead, tr
zgodny
charoff
col, colgroup, tbody, td, tfoot, th, thead, tr
zgodny
charset
a, link, script
zgodny
checked input
zgodny
cite blockquote,
q, del, ins
zgodny
class
wszystkie oprócz: base, basefont, head, html,
meta, param, script, style, title
zgodny
classid object
zgodny
clear br
Deprecated
code applet
Deprecated
codebase object
zgodny
codebase applet
Deprecated
codetype object
zgodny
color basefont,
font
Deprecated
cols textarea
zgodny
cols frameset
Frameset
colspan td,
th
zgodny
compact
dir, dl, menu, ol, ul
Deprecated
content meta
zgodny
coords area,
a
zgodny
data object
zgodny
datetime del,
ins
zgodny
declare object
zgodny
defer script
zgodny
dir
wszystkie oprócz: applet, base, basefont, bdo, br,
frame, frameset, iframe, param, script
zgodny
dir bdo
zgodny
disabled
button, input, optgroup, option, select, textarea
zgodny
enctype form
zgodny
face basefont,
font
Deprecated
for label
zgodny
frame table
zgodny
frameborder frame,
iframe
Frameset
headers td,
th
zgodny
Spis atrybutów
Nazwa Występowanie w znacznikach
XHTML 1.0
height
img, object
+ zgodny
height
iframe, td, th, applet
+
Deprecated
href
a, area, link, base
zgodny
hreflang a,
link
zgodny
hspace
applet, img, object
Deprecated
http-equiv meta
zgodny
id
wszystkie oprócz: base, head, html, meta, script,
style, title
zgodny
ismap img,
input
zgodny
label option,
optgroup
zgodny
lang
wszystkie oprócz: applet, base, basefont, br,
frame, frameset, iframe, param, script
+ zgodny
language script
Deprecated
link body
Deprecated
longdesc img
zgodny
longdesc frame,
iframe
Frameset
marginheight frame,
iframe
Frameset
marginwidth frame,
iframe
Frameset
maxlength input
zgodny
media style,
link
zgodny
method form
zgodny
multiple select
zgodny
name
button, textarea, select, form, img, a, input,
object, map, param, meta
zgodny
name frame,
iframe
+
Frameset
name applet
+
Deprecated
nohref area
zgodny
noresize frame
Frameset
noshade hr
Deprecated
nowrap td,
th
Deprecated
object applet
Deprecated
onblur
*
a, area, button, input, label, select, textarea
zgodny
onchange
*
input, select, textarea
zgodny
onclick
*
wszystkie oprócz: applet, base, basefont, bdo, br,
font, frame, frameset, head, html, iframe, isindex,
meta, param, script, style, title
zgodny
ondblclick
*
wszystkie oprócz: applet, base, basefont, bdo, br, zgodny
Spis atrybutów
Nazwa Występowanie w znacznikach
XHTML 1.0
font, frame, frameset, head, html, iframe, isindex,
meta, param, script, style, title
onfocus
*
a, area, button, input, label, select, textarea
zgodny
onkeydown
*
wszystkie oprócz: applet, base, basefont, bdo, br,
font, frame, frameset, head, html, iframe, isindex,
meta, param, script, style, title
zgodny
onkeypress
*
wszystkie oprócz: applet, base, basefont, bdo, br,
font, frame, frameset, head, html, iframe, isindex,
meta, param, script, style, title
zgodny
onkeyup
*
wszystkie oprócz: applet, base, basefont, bdo, br,
font, frame, frameset, head, html, iframe, isindex,
meta, param, script, style, title
zgodny
onload
*
body zgodny
onload
*
frameset
Frameset
onmousedown
*
wszystkie oprócz: applet, base, basefont, bdo, br,
font, frame, frameset, head, html, iframe, isindex,
meta, param, script, style, title
zgodny
onmousemove
*
wszystkie oprócz: applet, base, basefont, bdo, br,
font, frame, frameset, head, html, iframe, isindex,
meta, param, script, style, title
zgodny
onmouseout
*
wszystkie oprócz: applet, base, basefont, bdo, br,
font, frame, frameset, head, html, iframe, isindex,
meta, param, script, style, title
zgodny
onmouseover
*
wszystkie oprócz: applet, base, basefont, bdo, br,
font, frame, frameset, head, html, iframe, isindex,
meta, param, script, style, title
zgodny
onmouseup
*
wszystkie oprócz: applet, base, basefont, bdo, br,
font, frame, frameset, head, html, iframe, isindex,
meta, param, script, style, title
zgodny
onreset
*
form zgodny
onselect
*
input, textarea
zgodny
onsubmit
*
form zgodny
onunload
*
body zgodny
onunload
*
frameset
Frameset
profile head
zgodny
prompt isindex
Deprecated
readonly textarea,
input
zgodny
rel a,
link
zgodny
rev a,
link
zgodny
rows textarea
zgodny
Spis atrybutów
Nazwa Występowanie w znacznikach
XHTML 1.0
rows frameset
Frameset
rowspan td,
th
zgodny
rules table
zgodny
scheme meta
zgodny
scope td,
th
zgodny
scrolling frame,
iframe
Frameset
selected option
zgodny
shape area
zgodny
shape a
zgodny
size
input, select
+ zgodny
size
hr, font, basefont
+
Deprecated
span col
zgodny
span colgroup
zgodny
src
script, input, img
zgodny
src frame,
iframe
Frameset
standby object
zgodny
start ol
Deprecated
style
wszystkie oprócz: base, basefont, head, html,
meta, param, script, style, title
zgodny
summary table
zgodny
tabindex
a, area, button, input, object, select, textarea
+ zgodny
target
a, area, base, form, link
+
Deprecated
text body
Deprecated
title
wszystkie oprócz: base, basefont, head, html,
meta, param, script, title
zgodny
type
a, link, object, param, script, style, input, button
+ zgodny
type
li, ol, ul
+
Deprecated
usemap img,
input,
object
zgodny
valign
col, colgroup, tbody, td, tfoot, th, thead, tr
zgodny
value
input, option, param, button
zgodny
value li
Deprecated
valuetype param
zgodny
version html
Deprecated
vlink body
Deprecated
vspace
applet, img, object
Deprecated
width img,
object,
table, col, colgroup
+ zgodny
Spis atrybutów
Nazwa Występowanie w znacznikach
XHTML 1.0
width
hr, td, th, applet, pre, iframe
+
Deprecated
*
Zdarzenia
+
patrz niżej
Wyjaśnienia terminów deprecated i frameset występują w dziale '
+
Zmiany XHTML 1.1 w stosunku do 1.0
accesskey
nie można go używać w
<a>
align
nie można go używać w
<capiton>
,
<div>
,
<h1>
-
<h6>
,
<hr>
,
<img>
,
<input>
,
<legend>
,
<p>
i
<table>
border
nie można go używać w
<img>
height
nie można go używać w
<td>
i
<th>
lang
nie można go używać we wszystkich znacznikach!
name
nie można go używać w
<a>
i
<map>
size
nie można go używać w
<hr>
tabindex
nie można go używać w
<a>
target
nie można używać go używać
<a>
,
<area>
,
<link>
i
<base>
.
type
nie można go używać w
<ol>
,
<li>
i
<ul>
value
nie można go używać w
<li>
width
nie można go używać w
<hr>
,
<td>
,
<th>
i
<pre>
W dalszych wersjach XHTML stopniowo będzie się likwidowało atrybuty -
zastąpi się je stylami lub w inny sposób (oczywiście atrybuty np: alt lub
summary nie znikną całkowicie nigdy).
Style w XHTML
Podstawowe informacje
Style są nieodłączną częścią XHTML. Odpowiadają one na wizualną,
interaktywną słyszalną i dotykową część strony. Style zastępują wiele
atrybutów. Niestety CSS2 nie jest w pełni interpretowany przez aktualne wersje
przeglądarek.
Budowa stylu:
selektor { element: wartość }
Selektor to znacznik XHTML (HTML) np.: p, h1, li itp. Element (cecha) to
właściwość danego znacznika odpowiadająca w pewnym sensie atrybutowi w
XHTML (HTML). Elementy są wymienione poniżej. Wartość może być liczbą lub
ciągiem znaków.
Elementy zastępujące atrybuty
Elementy zastępujące niektóre atrybuty:
Atrybut Element
align text-align
face (w <font>)
font-family
size (w <font>)
font-size
cellpadding padding
cellspacing paddnig
color color
bgcolor background-color
background background-image
valign vertical-align
width width
height height
clear clear
border border
Zamiast:
należy używać:
<h1 style="text-align: center">XYZ</h1>
Oczywiście jest to tylko przykład.
Spis elementów
Elementy:
azimuth
#
cue-after
#
marker-offset
+
richness
#
background
+
cue-before
#
marks
+
right
+
background-
cursor
+
max-height
+
size
+
attachment
+
background-color
+
direction
+
max-width
+
speak
#
background-image
+
display
+#@
min-height
+
speak-header
#
background-position
+
elevation
#
min-width
+
speak-numeral
#
background-repeat
+
empty-cells
+
orphans
+
speak-
punctuation
#
border
+
float
+
outline
+
speech-rate
#
border-collapse
+
font
+
outline-color
+
stress
#
border-color
+
font-family
+
outline-style
+
table-layout
+
border-spacing
+
font-size
+
outline-width
+
text-align
+
border-style
+
font-size-adjust
+
overflow
+
text-decoration
+
border-top
*+
font-stretch
+
padding
+
text-indent
+
border-top-color
*+
font-style
+
padding-top
*+
text-shadow
+
border-top-style
*+
font-variant
+
page
+
text-transform
+
border-top-width
*+
font-weight
+
page-break-after
+
top
+
border-width
+
height
+
page-break-
before
+
unicode-bidi
+
bottom
+
left
+
page-break-
inside
+
vertical-align
+
caption-side
+
letter-spacing
+
pause
#
visibility
+
clear
+
line-height
+
pause-after
#
voice-family
#
clip
+
list-style
+
pause-before
#
volume
#
color
+
list-style-image
+
pitch
#
white-space
+
content
+#@
list-style-
position
+
pitch-range
#
widows
+
counter-increment
+#@
list-style-type
+
play-during
#
width
+
counter-reset
+#@
margin
+
position
+
word-spacing
+
cue
#
margin-top
*+
quotes
+
z-index
+
*
right
, left lub bottom
+
wzrokowy
#
słuchowy
@
dotykowy
Wstawianie stylów
1. Zagnieżdżanie stylów wewnątrz dokumentu
Przykład:
<!-- prolog na początku -->
<head>
<!-- to są właściwe style, w sekcji head -->
<style type="text/css">
p { font-size: 10px; font-family: monospace }
h1,h2 { text-align: center; color: blue }
</style>
<!-- koniec stylów -->
</head>
<!-- dalsza część jest dokumentu -->
2. Style lokalne w dokumencie
Jest to metoda nie zalecana, ponieważ jest niewydajna. Zadaniem styli przecież
jest ułatwianie pracy i maksymalne jej skracanie. Jedną z ważnych funkcji CSS
jest możliwość wykorzystywania ich w kilku dokumentach, czego nie oferuje ta
metoda. Radzę korzystać z innych rodzajów wstawiania styli. Jeśli ktoś chce
dla jednego znacznika przypisywać różne właściwości (i używać go kilka razy
w dokumencie XHTML) polecam
class
lub
id
.
Przykład:
<!-- wsześniej prolog i sekcja head -->
<body>
<p style="color: red; font-size: 10pt">XYZ</p>
<p style="color: green">ABC</p>
</body>
<!-- dalej koniec dokumentu -->
3. Dołączanie zewnętrznego arkusza stylów
Jest to metoda najczęściej spotykana. Daje ona najwięcej możliwości i w pełni
wykorzystuje funkcje stylów. Po stworzeniu zewnętrznego pliku CSS można go
wykorzystać w kilku stronach (zyskacie naprawdę dużo czasu:-).
Przykład pliku zewnętrznego:
/* jest to przykład zewnętrznego pliku z rozszerzeniem CSS */
p { font-size: 10px; font-family: monospace }
h1,h2 { text-align: center; color: blue }
Przykład pliku XHTML:
<!-- prolog na początku -->
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<!-- dalsza część jest dokumentu -->
Można też arkusz stylu zewnętrznego dołączyć w znaczniku
<? ?>
(patrz:
'
'). Ta metoda nie jest obowiązkowa ale zalecana ze względu
za zgodność z XML.
4. Importowanie arkusza stylów
Przykład:
<!-- prolog na początku -->
<head>
<!-- to są właściwe style, w sekcji head -->
<style type="text/css">
@import url(http://www.xyz.pl/style.css)
</style>
</head>
<!-- dalsza część jest dokumentu -->
5. Inne metody
Rozciąganie stylu przez znaczniki <span> i <div>.
Oba sposoby są podobne. Różnią się tylko tym, że <div> jest bardziej
elastyczny. Nie są to popularne metody.
Przykład z <span>:
<!-- prolog i sekcja head -->
<body>
<!-- 1 możliwość -->
<span class="klasa">
<dl>
<dt>to jest lista</dt>
<dd>jeden</dd>
<dd>dwa</dd>
<dd>trzy</dd>
</dl>
</span>
<!-- 2 możliwość -->
<span style="font-size: 10pt; color: green">
<dl>
<dt>to jest lista</dt>
<dd>jeden</dd>
<dd>dwa</dd>
<dd>trzy</dd>
</dl>
</span>
</body>
<!-- dalej koniec dokumentu -->
Przykład z <div>:
<!-- prolog i sekcja head -->
<body>
<!-- 1 możliwość -->
<div class="klasa">
<table summary="przykład" border="1">
<tbody>
<tr>
<td>zz</td>
<td>zz</td>
</tr>
</tbody>
</table>
</div>
<div style="font-size: 10pt; text-align: right">
<table summary="przykład" border="1">
<tbody>
<tr>
<td>vv</td>
<td>vv</td>
</tr>
</tbody>
</table>
</div>
</body>
<!-- dalej koniec dokumentu -->
Inne ważne zasady
Są tu wymienione zasady XHTML, które zmieniły się w stosunku do HTML. Są
to zasady, które dotyczą bardziej skomplikowanych rzeczy niż wymienione w
temacie '
Symbol '&'
Jeśli w adresie będzie symbol '&' (szczególnie w skryptach CGI) należy go
zastąpić zamiennikiem
&
.
Przykład nie poprawnego zapisu:
Poprawny przykład:
http://my.site.dom/cgi-bin/myscript.pl?class=guest&name=user.
Atrybuty 'id' i 'name'
W znacznikach <a> i <map> atrybuty name są zakazane. Teraz należy używać
atrybutu id. W specyfikacji XHTML identyfikator # nie odnosi się do name tylko
do id.
Przykład nie poprawnego zapisu:
Poprawny przykład:
<a id="poczatek"></a>
Przykład wywołania:
<a href="#poczatek>xyz</a>
Atrybuty 'id' i 'class'
Atrybuty id i class są ściśle związane ze stylami (patrz: '
XHTML odwołanie się do '#' możliwe jest tylko przez atrybut id (identyfikator ID)
a odwołanie się do '.' możliwe jest tylko przez class (klasa).
<!-- prolog -->
<head>
<style type="text/css">
.klasa { color: blue }
#id { color: green }
</style>
</head>
<body>
<p class="klasa">To jest tekst niebieski</p>
<p id="id">To jest tekst zielony</p>
</body>
<!-- dalej koniec dokumentu -->
Komentarze
Komentarze w XHTML wyglądają tak samo jak w HTML: zaczynają się <!-- a
kończą się -->.
Przykład:
<!-- treść komentarza -->
Skrypty i style
XHTML zaleca się stosowanie innego zapisu stylów i skryptów niż w HTML.
Związane jest to z sekcją CDATA.
Przykład:
<script type="text/javascript">
<![CDATA[
treść skryptu
]]>
</script>
lub
<style type="text/css">
<![CDATA[
treść stylów
]]>
</style>
Zapis ten ma ujednolicić zapis elementów nie związanych z językami opartymi
na znacznikach (np. XHTML). Zapis ten ma także "czuwać" nad poprawnym
rozwijaniem się stylów, skryptów itp. Oczywiście ten zapis został zaczerpnięty
z XML. Wszystko co znajduje się w sekcji CDATA jest ignorowane przez paser.
Niestety dzisiejsze przeglądarki nie interpretują tak zapisanych stylów i
skryptów wewnątrz dokumentu XHTML, można więc przejściowo zasadę tą
pominąć.
Rozszerzenie dokumentu XHTML
W XHTML zezwala się na korzystanie z rozszerzenia *.html, jednak poprawnym
rozszerzeniem jest *.xhtml. W przyszłości planuje się korzystanie tylko z
rozszerzenia *.xhtml. Należy zaznaczyć, że dokumenty z takim roszerzeniem
mają typ MINE:
application/xhtml+xml
a nie
text/html
.
Niektóre przeglądarki mają problem poprawnym wyświetlaniem plików *.xhtml.
Skrypty PHP
W specyfikacji XHTML nie ma mowy o skryptach takich jak PHP ale jeśli
nadejdzie potrzeba ich użycia to należy posłużyć się instrukcjami
przetwarzania (są one zaczerpnięte bezpośrednio ze specyfikacji XML). Proszę
zwrócić uwagę na to, że po <? występuje nazwa (<?php). Jest to bardzo ważne,
ponieważ nazwa pozwala zidentyfikować dalszy ciąg znaków. W HTML można
spotkać treść skryptów w środku znaczników takich jak <? ?>, <% %>.
Wszystkie te oznaczenia w XHTML są nie prawidłowe! Nie zaleca się też
stosowania
<script language="php"></script>
.
Poprawny przykład:
<?php
// treść skryptu
?>
Na dzień dzisiejszy we wstawianiu skryptów zaleca się stosowanie sekcji
CDATA jednak zapis powyżej jednak jest bardziej powszechny. Łatwo
zauważyć, że deklaracja zgodności z XML jest także instrukcją przetwarzania
(patrz: '
Animacje Flash a XHTML
Na większości stronach animacje Flash są wstawiane niepoprawnie. Nawet
programy generujące kod HTML robią to często niepoprawnie. Prawidłowe
wstawienie Flasha do dokumentu XHTML powinno wiązać się tylko z
znacznikiem <object>. Używanie znacznika <embed> jest nieprawidłowe,
ponieważ taki znacznik nie figuruje w specyfikacji XHTML (nawet nie występuje
w specyfikacji HTML). W XHTML 1.1 nie ma możliwości wstawienia
jakiegokolwiek obiektu (czyli także Flasha). Warto zwrócić uwagę na SVG, które
w najbliższym czasie wyprze Flasha lub przynajmniej będzie stanowić dla
niego alternatywę. SVG jest to język oparty na XML, który służy do opisywania
figur za pomocą wektorów (czyli obrazek SVG można będzie zmieniać,
poprawiać lub nawet tworzyć za pomocą zwykłego edytora tekstowego tak jak
XHTML). SVG ma typ MINE:
image/svg+xml
.
Przykład SVG:
<?xml version="1.0"?>
<svg xmlns="http://www.w3.org/2000/svg">
<rect stroke="black" y="80px" x="50px" width="160px" height="70px" />
<circle stroke="black" cy="80px" cx="50px" r="50px" />
</svg>
Matematyka w XHTML
XHTML (podobnie jak HTML) nie jest przystosowany do zapisu wzorów
matematycznych. Matematycy, fizycy i inni ludzie nauk ścisłych powinni więc
korzystać z języka MathML. Język ten jest bardzo podobny do XHTML
ponieważ jest oparty na XML. Już teraz niektóre przeglądarki interpretują
dostatecznie ten język. MathML i znaki specjalne (patrz: '
') umożliwiają zapisanie niemal każdego działania matematycznego.
Przykład MathML:
<?xml version="1.0"?>
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mroot>
<mfrac>
<mn>2</mn>
<mn>3</mn>
</mfrac>
<mn>3</mn>
</mroot>
</math>
Symbole i znaki specjalne
Spis niektórych symboli
Spis wielkich liter greckich
Symbol I
II
Α Α Α
Β Β
Β
Γ Γ Γ
∆ Δ Δ
Ε Ε Ε
Ζ Ζ
Ζ
Η Η
Η
Θ Θ Θ
Ι Ι
Ι
Κ Κ Κ
Λ Λ Λ
Spis wielkich liter greckich
Symbol I
II
Μ Μ
Μ
Ν Ν
Ν
Ξ Ξ
Ξ
Ο Ο Ο
Π Π
Π
Ρ Ρ
Ρ
Σ Σ Σ
Τ Τ
Τ
Υ Υ Υ
Φ Φ
Φ
Χ Χ
Χ
Ψ Ψ
Ψ
Ω Ω Ω
Spis małych liter greckich
Symbol I
II
α α
α
β β
β
γ γ γ
δ δ
δ
ε ε ε
ζ ζ
ζ
η η
η
θ θ
θ
ι ι
ι
κ κ κ
λ λ λ
µ μ
μ
ν ν
ν
ξ ξ
ξ
ο ο ο
π π
π
ρ ρ
ρ
ς ς ς
σ σ
σ
τ τ
τ
υ υ υ
Spis małych liter greckich
Symbol I
II
φ φ
φ
χ χ
χ
ψ ψ
ψ
ω ω ω
ϑ
ϑ ϑ
ϒ
ϒ ϒ
ϖ
ϖ ϖ
Spis symboli listowych
Symbol I
II
℘
℘ ℘
ℑ
ℑ ℑ
ℜ
ℜ ℜ
™ ™ ™
ℵ
ℵ ℵ
Strzałki
Symbol I
II
← ←
←
↑ ↑
↑
→ →
→
↓ ↓
↓
↔ ↔
↔
↵
↵ ↵
⇑
⇑ ⇐
⇓
⇓ ⇑
⇔
⇒
Spis symboli matematycznych
Symbol I
II
∏ prod
∏
∑ sum
∑
√ radic
√
∞ infin
∞
and
∧
⊦
or ∨
∫ int
∫
sim
∼
≅
cong ≅
≈ asymp
≈
≠ ne
≠
≡ equiv
≡
≤ le
≤
≥ ge
≥
Spis niektórych znaków specjalnych
Podstawowe znaki
Symbol I
II
" "
"
& &
&#38;
< <
&#60;
> >
>
' '
'
Różne znaki
Symbol I
II
Œ Œ Œ
œ œ œ
Š Š
Š
š š
š
Ÿ Ÿ Ÿ
› ›
›
€ € €
£ £
£
¥ ¥ ¥
¢ ¢ ¢
§ § §
Różne znaki
Symbol I
II
© © ©
º º
º
® ® ®
² ²
²
³ ³
³
‰ ‰
‰
¼ ¼
¼
½ ½
½
¾ ¾
¾
° ° °
± ±
±
÷ ÷
÷
ø ø
ø
· ·
·
Niestety nie wszystkie znaki powyżej można zobaczyć w przeglądarkach. Np. w
Netscape Communicator 4 nie widać żadnych znaków.
Basic XHTML
Opis języka
Basic XHTML jest następcą Compact HTML. Jest to młodszy brat XHTML, za
pomocą którego tworzy się mniej skomplikowane strony, podobny jest do
WML. Jest jego konkurentem. Basic XHTML przeznaczony jest do takich
urządzeń jak:
•
telefony komórkowe
•
telewizory
•
pejdżery
•
systemy nawigacyjne samochodu
•
przenośne gry telewizyjne
•
organizery
•
zegarki
•
notatniki managerskie
•
i wiele innych
Basic XHTML jest standardem zalecanym przez W3C. Strony napisane w Basic
XHTML są zgodne z XHTML.
Znaczniki Basic XHTML
1. Ogólne:
o
body
o
head
o
html
o
title
o
meta
o
base
o
link
2. Tekstu:
o
abbr
o
acronym
o
address
o
blockquote
o
br
o
cite
o
code
o
dfn
o
div
o
em
o
h1, h2, h3, h4, h5, h6
o
kbd
o
p
o
pre
o
q
o
samp
o
span
o
strong
o
var
3. Linku:
o
a
4. Listy:
o
dl
o
dt
o
dd
o
ol
o
ul
o
li
5. Formularzy:
o
from
o
input
o
label
o
select
o
option
o
textarea
6. Tabel:
o
caption
o
table
o
td
o
th
o
tr
7. Obrazu:
o
img
8. Obiektu:
o
object
o
param
Prolog
Tak powinien wyglądać prolog:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN"
"http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd">
Dokumenty Basic XHTML wyglądają tak samo jak dokumenty XHTML. A oto
przykład:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-2" />
<title>Przypładowa strona</title>
</head>
<body>
<h1>Oto przykład</h1>
</body>
</html>
Style
W specyfikacji Basic XHTML nie ma znacznika <style>. Można tylko używać
znacznika <link> do arkusza zewnętrznego. W Bacic XHTML style mogą być
przedstawiane znacznikami <div> i <span>. Atrybut stylów jest dozwolony
tylko 'class'. Zaleca się deklarowanie atrybutu 'media' by rozpoznać typ
urządzenia, do którego dokument jest przeznaczony.
Inne ważne zasady
Znaczniki <script> i <noscript> są zabronione w specyfikacji tego języka (ze
względu na swoje przeznaczenie).
Reszta zasad jest tak sam jak w XHTML i jest przedstawiona w całym kursie.
Linki i parsery
Linki
Strony polskie:
Strony kursu języka HTML Pawła Wimmera.
Strony najlepszego edytora stron internetowych. Wersja 5.0 Pajączka
obsługuje XHTML.
Strony zagraniczne:
Strony World Wide Web Consortium. Tu znajdziesz wszelkie informacje o
nowych i starych standardach internetowych.
http://www.w3schools.com/xhtml/
W3 Schools, ciekawy strony o XHTML i nie tylko.
Specyfikacja XHTML 1.1, najnowsze zalecenia i zmiany dotyczące
XHTML 1.1 - niepełna specyfikacja.
Specyfikacja XHTML 1.0, komplet informacji i wprowadzenie w "świat"
XHTML - pełna specyfikacja.
http://www.w3.org/TR/xhtml-basic/
Specyfikacja Basic XHTML.
Specyfikacja SVG 1.1.
Specyfikacja SVG 1.0.
Specyfikacja MathML.
Strony przeznaczone wyłącznie dla XHTML.
Parsery
Parsery służą do sprawdzania błędów (czasami też do ich poprawiania).
Zachęcam do korzystania z nich, ponieważ nawet najlepszym zdarzają się
pomyłki. Parserem do XHTML godnym polecenia jest W3C Validator, który
znajduje się pod adresem:
. Możemy także sprawdzić
poprawność stylów pod adresem:
http://jigsaw.w3.org/css-validator/
. Dobrym
programem sprawdzającym poprawność dokumentu jest Tidy. Wszystkie
informacje dotyczące tego programy znajdują się na
http://www.w3.org/People/Raggett/tidy/
.
Gdy strona zostanie sprawdzona i zostaną poprawione błędy dobrym
zwyczajem jest umieścić button wskazujący na zgodność z XHTML i CSS (patrz
na dół).
Copyright © 2002
Wszystkie prawa zastrzeżone.