Lekcja HTML 1- Podstawowe znaczniki HTML

Witam w drugim kursie przygotowującym do Kwalifikacji E.14. Tym razem przedstawię i omówię znaczniki HTML które umieszczamy między znacznikami <body>, czyli te znaczniki będą miały bezpośredni wpływ na zawartość naszej strony.

Zapraszam.

Wiersze i akapity

Każdy tekst, który nie jest objęty specjalnym znacznikiem, jest interpretowany jako “zwykły tekst”. Gdybyśmy jednak wpisali dłuższy fragment tekstu, rozdzielić w edytorze akapity za pomocą klawisza Enter, przeglądarka zignoruje znaki końca wierszy i akapitów i wyświetli jednolity blok tekstu. Aby rozdzielić akapity, należy się posłużyć się znacznikiem <p> (p = paragraph), który wstawi interlinie między poszczególne fragmenty tekstu. Znacznikiem zamykającym jest <p>.

Przykład:

<p>Treść pierwszego akapitu <p>

<p>Treść drugiego akapitu <p>

 

Aby przełamać tekst, nie wprowadzając przy tym znaku końca akapitu, możemy zastosować pojedynczy znacznik <br/>, który przenosi tekst o jeden wiersz w dół nie wprowadzając dodatkowej interlinii.

Pierwszy wiersz <br/>
Drugi wiersz <br/>
Trzeci wiersz <br/>

Napisanie kilku kolejnych <br/> pozwala poszerzyć pionowy odstęp między paragrafami. Znacznik <br/> nie występuje w parze ze znacznikiem zamykającym.

 

Tytuły

W dokumentach często wprowadzamy nagłówki, tytuły. Służy do tego para znaczników <hn> </hn>. Znak H oznacza header, natomiast cyfra n to stopień tytułu (jest ich sześć). Przykładowo polecenie wprowadzające tytuł stopnia pierwszego składa się ze znacznika otwierającego <h1> i zamykającego </h1>. Im wyższy numer nagłówka tym mniejsza czcionka

Przykład:

<h1>Tytuł 1</h1>

<h2>Tytuł 2</h2>

<h3>Tytuł 3</h3>

<h4>Tytuł 4</h4>

<h5>Tytuł 5</h5>
<h6>Tytuł 6</6>

 

Pozioma linia

Często spotykanym elementem jest linia pozioma , która  wstawiamy za pomocą znacznika <hr> (ang. horizontal rule).

Możemy określić dowolną grubość linii

<hr size=5>

Linia może mieć określoną w pikselach długość

<hr width=300>

lub długość wyrażoną w procencie szerokości strony

<HR width=50%>

 

Atrybuty czcionki

Aby tekst w przeglądarce nie wyglądał wszędzie tak samo, stosujemy  dodatkowe atrybuty czcionki :

<strong>Tekst pogrubiony<strong>

<em>Tekst pochylony</em>

<u>Tekst podkreślony</u>

 

Grafika

Grafika na stronach www jest bardzo istotnym elementem – urozmaica ich czytanie.

Na stronach WWW są stosowane dwa podstawowe formaty bitowych plików graficznych – GIF i JPG (JPEG) – które są z założenia skompresowane (często nawet dziesięciokrotnie w stosunku do innych popularnych formatów), a więc zajmują znacznie mniej miejsca grafiki w innych formatach. Dzięki temu transmisja strony trwa znacznie krócej.

Grafikę możemy wprowadzić na stronę za pomocą znacznika:

<img src=”nazwa_pliku”>

W najprostszym przypadku, gdy obrazek znajduje się w tym samym katalogu co dokument, wystarczy podać jego nazwę. Gdy grafiki gromadzimy w odrębnym katalogu, konieczne jest podanie ścieżki dostępu.

Przykład:

<img src=”grafika/domek.gif”>

Wielkość obrazka możemy regulować za pomocą parametrów height (wysokość) i width (szerokość).

 

<img src=”tucows.gif” width=200 height=50>

 

źródła:midzi.info

Dodaj komentarz