Nauczyliśmy się już budować listy oraz wstępnie formatować tekst. Tym razem dowiemy się jak poprawnie podzielić tekst na akapity, jak z akapitów zrobić bloki, które następnie będzie można pozycjonować za pomocą stylów, oraz jak wstawiać na stronę nagłówki.

Wiemy jak tworzyć akapity stosując tagi {html}
{/html}. Musimy jednak pamiętać, że nowa linia wprowadzona z klawiatury poprzez wciśnięcie klawisza Enter jest ignorowana przez przeglądarki.

Tekst napisany w ten sposób nadal jest wyświetlany w jednej linii – dokładniej jest on łamany w miejscu, które przeglądarka uzna za słuszne lub gdy przestaje się mieścić na ekranie. Mimo że dawało to zadowalające rezultaty, nie jest to rozwiązanie poprawne, a ponadto mało elastyczne. Zapoznajmy się więc z poprawnym sposobem podziału tekstu na akapity w HTML-u.

Akapity

Do wydzielania akapitów w języku HTML służy znacznik {html}

{/html}. Używa się go w sposób podobny do większości znaczników: tekst, który jest akapitem, trzeba umieścić pomiędzy {html}

{/html} a {html}

{/html}:

Każdy akapit w HTML-u powinien być umieszczany pomiędzy znacznikami <p> a </p>

Stosowanie akapitów w tej postaci pozwala także na formatowanie położenia tekstu w akapicie za pomocą stylów. Dowiemy się jak za ich pomocą wyjustować tekst w akapicie.
W tym celu odpowiedni styl umieszczamy w parametrze style znacznika {html}

{/html}. Do justowania tekstu w akapicie należy użyć stylu o nazwie text-align, który przyjmuje następujące wartości:

• left – wyrównuje tekst do lewej strony,
• right – wyrównuje tekst do prawej strony,
• center – wyrównuje tekst do środka,
• justify – wyrównuje tekst do obu stron.

Oto przykład:

Tekst umieszczony w akapicie można justować korzystając ze stylów, tak jak to zrobiono tutaj.

Przydatna może się też okazać możliwość zmiany koloru tekstu w akapicie lub koloru tła. Do zmiany koloru tekstu służy styl color. Jego parametrem jest kod koloru zapisany w postaci szesnastkowej:

gdzie RR odpowiada składowej czerwonej, GG składowej zielonej, natomiast BB składowej niebieskiej koloru. Można to także zapisać w taki sposób:

gdzie R, G, B są wartościami poszczególnych składowych zapisanych jako cyfry dziesiętne. Może wydawać się to skomplikowane, warto więc zapamiętać, że każdy program graficzny podczas wyboru koloru pokazuje także te trzy składowe wybranego koloru – Paint pozwala odczytać wartość RGB w postaci dziesiętnej.

Zamiast składowych RGB można także użyć kilku predefiniowanych nazw kolorów (rys. 1): aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white oraz yellow.

Do zmiany koloru tła trzeba użyć stylu background-color, który przyjmuje dokładnie takie same parametry co styl color.

Nagłówki

Nagłówki dzielą stronę na części i stanowią najczęściej swoisty tytuł danej części – pełnią podobną rolę do nazw rozdziałów w książce, tytułów artykułów czy też tytułów nad akapitami w tym artykule. W HTML-u zdefiniowano sześć poziomów nagłówków. Ich znaczniki to \”{html}

HYML

Formatowanie tekstu

Znaczniki logiczne

Znaczniki fizyczne

Listy

Listy wypunktowane

Listy numerowane

Listy definicji

Bloki tekstu

Akapity

Nagłówki

Bloki <div>

Nagłówki nie służą do wyróżniania fragmentów tekstu – do tego służą znaczniki przedstawione w pierwszej części kursu.

Częstą praktyką jest umieszczanie na górze strony nagłówka, który odpowiada tytułowi strony (znacznik {html}