Podstawowe znaczniki HTML i struktura strony

Ten poradnik pokaże Ci podstawowe znaczniki języka HTML, które pomogą Ci przy tworzeniu Twojej pierwszej strony internetowej. Dodatkowo umieszczę tutaj strukturę strony, która jest niezbędna do tego, aby w ogóle zacząć.

Na początku ucz się tych znaczników w notatniku. Utwórz dokument i zapisz go z rozszerzeniem .html

Nagłówki

Nagłówek to część tekstu, która pojawia się na początku każdej strony w edytorach tekstu. Nagłówki można zastosować np. do tytułów tak jak w moim przypadku.

<h1> nagłówek poziomu 1 </h1>
<h2> nagłówek poziomu 2 </h2>
<h3> nagłówek poziomu 3 </h3>
<h4> nagłówek poziomu 4 </h4>
<h5> nagłówek poziomu 5 </h5>

Jak widać nagłówki mają różne poziomy, a każdy z poziomów nagłówka to inny rozmiar tekstu.

WAŻNE

Zauważyłeś, że gdy rozpoczynamy znacznik np. <h1> to po wpisaniu tekstu należy go również zamknąć? W tym celu używamy znacznika </h1>. Jeżeli nie zamkniesz znacznika zastosujesz efekt nagłówka do całego tekstu na stronie.

Formatowanie czcionek

Formatowanie czcionek jest to wyróżnienie danego fragmentu tekstu, lecz nie jak w przykładzie nagłówka. Najprostsze znaczniki formatowania czcionek to:

<strong> czcionka pogrubiona </strong>
<u> czcionka podkreślona </u>
<i> czcionka pochylona </i>

Przechodzenie do nowej linijki

Aby przejść do nowej linijki należy skorzystać ze znacznika <br> ten znacznik jako jeden z niewielu nie potrzebuje zamknięcia. Drugim znacznikiem jest <p> i oznacza on utworzenie nowego akapitu. Ten znacznik w przeciwieństwie do <br> należy zamknąć.

Odsyłacze hipertekstowe

Odsyłacz hipertekstowy to taki, który, gdy go naciśniesz - przenosi Cię na inny adres - są to tak zwane linki.

<a href="adres_strony_internetowej"> Twoja strona internetowa </a>

W miejscu "adres_strony_internetowej" można wpisać np: http://www.wlasna-www.blogspot.com. Po wyświetleniu pokaże nam się napis "Twoja strona internetowa", która przeniesie Cię pod wpisany wcześniej adres.

Dodawanie grafiki

Aby dodać grafikę do strony internetowej musisz użyć znacznika <img>, a dokładna składnia tego polecenia to:

<img src="adres_do_obrazka"> 

W miejscu "adres_do_obrazka" należy wpisać ścieżkę do pliku lub link do pliku KONIECZNIE Z ROZSRZERZENIEM, np:

<img src="stronainternetowa.pl/obrazek.jpg">

Struktura strony

Na sam koniec najważniejsza rzecz - struktura strony. Jest to niezbędny element każdej strony internetowej. Jeżeli nie napiszesz struktury strony to nie masz po co brać się za pisanie stron. Bez tego elementu w ogóle nie możesz zacząć.

Strukturę strony można pobrać TUTAJ