Co prawda w sekcji <body> można umieścić tekst skopiowany np. z notatnika i będzie on poprawnie wyświetlony przez przeglądarkę, jednak nie będziemy mieli żadnej kontroli nad formatowaniem tekstu i układaniem kolejnych jego bloków.
W dokumencie HTML możemy użyć kilku znaczników skutecznie ułatwiających rozmieszczanie poszczególnych fragmentów tekstu na naszej stronie.
Nagłówki
<h1>-<h6>...</h1>-</h6>
Możemy używać nagłówków od <h1> do <h6>. <h1> jest najbardziej znaczący. Możemy np. za pomocą nagłówka <h1> zdefiniować tytuł dla całej naszej witryny. <h1> będzie taki sam na każdej podstronie naszego serwisu. Za pomocą <h2> nadać podtytuł dla każdej podstrony inny. Załóżmy, że będzie to tytuł artykułu. Dalej za pomocą <h3> dodamy tytuł rozdziału w artykule itd.
Podział tekstu na bloki
<div>...</div> - blok tekstu. Gromadzi większe partie tekstu, np. akapity.
<p>...</p> - akapit. Definiuje poszczególne akapity w tekście.
Wyróżnianie tekstu
HTML umożliwia wyróżnienie tekstu poprzez użycie kilku znaczników. Poniżej zaprezentuję najważniejsze z nich:
<span>...</span> - służy do wydzielania fragmentów tekstu, np. kilku słów albo zdania, celem osobnego sformatowania za pomocą styli.
<b>...</b> lub <strong>...</strong> - pogrubienie tekstu. Zamiast znaczników HTML można użyć stylu CSS. <span style="font-weight:bold;">...</span>
<i>...</i> lub <em>...</em> - pochylenie tekstu. Zamiast znaczników HTML można użyć stylu CSS. <span style="font-style:italic;">...</span>
<u>...</u> - zdeprecjonowany. Podkreślenie tekstu. Zamiast znaczników HTML można użyć stylu CSS. <span style="text-decoration: underline;">...</span>
<s>...</s> lub <strike>...</strike> - zdeprecjonowany. Przekreślenie tekstu. Zamiast znaczników HTML można użyć stylu CSS. <span style="text-decoration: line-through;">...</span>
<sup>...</sup> - indeks górny.
<sub>...</sub> - indeks dolny.
<ins>...</ins> - treść wstawiona. Pozwala śledzić na zmiany na stronie. Tekst wstawiony jest podkreślony.
<del>...</del> - treść usunięta. Pozwala śledzić na zmiany na stronie. Tekst usunięty jest przekreślony.
<font>...</font> - zdeprecjonowany. Umożliwia zmianę koloru, wielkości i kroju czcionki użytej w tekście.
<font size="5" color="red" face="Verdana">...</font> - zmienia wielkość czcionki na 5 (wielkości możliwe: 1-7. Domyślna to 3), kolor na czerwony i krój czcionki na "Verdana". Używając CSS ten sam efekt uzyskamy po zastosowaniu stylu: <span style="color:red;font-size:24px;font-family:'Verdana'">...</span>
<small>...</small> - wyróżnienie tekstu poprzez jego pomniejszenie.
<big>...</big> - Wyróżnienie tekstu poprzez jego powiększenie.
<pre>...</pre> - tekst preformatowany. W HTML po wklejeniu tekstu np. z notatnika wielokrotne spacje zostaną zastąpione jedną, a znaki końca linii zostaną zignorowane. Znacznik <pre> pozostawia jednak wielokrotne spacje, tabulatory oraz entery. Tekst jest wyświetlany czcionką o stałej szerokości.
<br /> - znacznik końca linii.
<hr /> - wstawia poziomą linię.
Pozostałe znaczniki
<q>...</q> lub <cite>...</cite>- krótki cytat umieszczany jako fragment linii dłuższego tekstu.
<blockquote>...</blockquote> - długi cytat umieszczany jako blok tekstowy.
<address>...</address> - umieszcza się w nim dane adresowe.
<code>...</code> - w tym znaczniku wyświetla się kod programu komputerowego.
<kbd>...</kbd> - fragment tekstu wprowadzany z klawiatury.
<samp>...</samp> - przykładowy kod komputerowy.
<var>...</var> - zmienna dla programu komputerowego.
<tt>...</tt> - styl pisania dalekopisu.
<dfn>...</dfn> - definicja opisywanego słowa lub wyrażenia.
<abbr>...</abbr> - służy do zaznaczania skrótów i form skróconych. Np <abbr>mgr</abbr> Jan Kowalski
<acronym>...</acronym> - służy do zaznaczania skrótów składających się z pierwszych liter poszczególnych słów. Np. <acronym>WWW</acronym> - World Wide Web
Znaki specjalne
Czasem zachodzi potrzeba użycia znaków, których HTML nie wyświetla lub nie można ich znaleźć na klawiaturze. Tu podam najważniejsze z nich.
© - znak copyright;
< - znak mniejszości. W HTML wszystkie znaczniki ujęte są w znak mniejszości i znak większości. Więc gdybyśmy w tekście chcieli umieścić taki znak, nasza przeglądarka zinterpretuje to jako polecenie i tego znaku nie wyświetli. Za pomocą < - możemy normalnie wyświetlać znak mniejszości.
> - znak większości. Co prawda taki znak zostanie poprawnie wyświetlony, ale dla zachowania porządku w kodzie HTML wyświetlając znaczniki na stronie. warto użyć znaków < i > dla otwarcia i zamknięcia znacznika.
- spacja niełamana. Jak wspomniałem powyżej przeglądarka zamienia kilka kolejnych spacji w jedną. Jeśli chcemy umieścić kilka spacji koło siebie to użyjemy
W dzisiejszej lekcji to tyle. Nie będzie na końcu rozbudowywania naszego przykładu strony o kolejne znaczniki. Na następnej lekcji aby utrwalić poznane dotąd znaczniki postaramy się zrobić pierwszą przyjemnie wyglądającą stronę używając poznanych znaczników.
