HyperText Markup Language
więcej niż tekst
język znaczników
nie jest to język programowania ale opisu dokumentu
<p>
To jest fragment <b>kodu
<abbr title='HyperText Markup Language'>HTML</abbr></b>
a to <a href='https://pl.wikipedia.org'>link do
Wikipedii</a>.
</p>
To jest fragment kodu HTML a to link do Wikipedii.
Znaczniki definiują elementy i ich zawartość
znacznik | element |
---|---|
<p> |
akapit (paragraf) |
<img> |
obraz |
<table> |
tabelka |
<a> |
odsyłacz |
… | … |
Znaczniki wyznaczają sekcje, mające początek i koniec
<znacznik>
zawartość
</znacznik>
Znaczniki mogą mieć atrybuty postaci klucz=wartość
<a href="https://alx.pl">ALX Szkolenia</a>
Wartości atrybutów powinny być w cudzysłowach lub apostrofach
<p title="Wstęp">Celem niniejszego opracowania jest...</p>
<p title='Zakończenie'>Dziękuję za uwagę...</p>
Dozwolone jest pominięcie cudzysłowów, jeśli wartość atrybutu nie zawiera spacji i znaków wprowadzających niejednoznaczność.
<a href=https://alx.pl>ALX Szkolenia</a>
Uchodzi to jednak za nieelegancki kod
Sekcje mogą być zagnieżdżone
<aaa>
<bbb>
<ccc>Hej</ccc>
</bbb>
<ddd>Cześć</ddd>
</aaa>
Nowe linie i spacje nie mają znaczenia.
<a><b><c>xxx</c></b><b>yyy</b></a>
Nowe linie i spacje nie mają znaczenia.
<a>
<b><c>xxx</c></b>
<b>yyy</b>
</a>
Nowe linie i spacje nie mają znaczenia.
<a>
<b>
<c>xxx</c>
</b>
<b>yyy</b>
</a>
Nowe linie i spacje nie mają znaczenia.
<a>
<b>
<c>xxx</c>
</b>
<b>yyy</b>
</a>
Znaczniki mogą być puste, tzn. nie posiadają znacznika zamykającego.
<img src='fotka1.jpg'>
<img src='fotka2.jpg'>
<img src='fotka3.jpg'>
Można spotkać się z poniższą notacją pochodzącą z języka XML/XHTML:
<img src='fotka1.jpg' />
<img src='fotka2.jpg' />
<img src='fotka3.jpg' />
Jest ona dopuszczalna ale niepotrzebna.
NIEDOZWOLONE
1 <u> 2 <b> 3 </u> 4 </b> 5
│ │ │ │
└─u────────────┘ │
└─────────────b─┘
Znaki mające specjalne znaczenie umieszcza się na stronie za pomocą encji:
znak | encja |
---|---|
< |
< |
> |
> |
& |
& |
<p>Obrazki to znacznik <img src="plik.png"></p>
Obrazki to znacznik <img src="plik.png">
<p>Obrazki to znacznik <img src="plik.png"></p>
Obrazki to znacznik
file:///
http://
lub https://
Document Object Model
(obiektowy model dokumentu)