Strona w języku

HTML

Język HTML jest najpopularniejszym językiem do tworzenia

stron www. Dokument HTML ma postać pliku tekstowego,

gdzie tekst przeplatany jest komendami ujętymi w nawiasy

ostre < >

Rozpoczęcie komendy <komenda>

Zakończenie komendy </komenda>

Plik HTML interpretowany jest przez dowolną przeglądarkę

internetową, która prezentuje dokument w jego

ostatecznym kształcie.

Strona w języku

HTML

Podstawowa struktura strony

<html>

Tytuł tworzonej przez nas strony

</title>
</head>

<body>

Treść jaką chcemy zamieścić na naszej stronie np.

Witaj na mojej stronie

</body>

</html>

łó

ło

Strona w języku

HTML

Wyjaśnienie struktury strony

<html> - informuje przeglądarkę, iż od tego momentu oglądany dokument jest

zapisany w języku HTML, otwarcie dokumentu HTML

<head> - otwarcie części nagłówkowej strony

<title> - umożliwia nadanie tytułu przeglądanej stronie; tytuł jest wyświetlany

w górnej części okna, tj. w pasku tytułowym.

</title> - informuje przeglądarkę o tym, iż skończyliśmy podawać tytuł.

</head> - zamknięcie części nagłówkowej

<body> - sekcja w której zawarta jest główna część dokumentu „ciało strony”.

Witaj na mojej stronie - składa się na nią w tym przypadku tylko ta

linijka tekstu.

</body> - zamknięcie sekcji body.
</html> - zamknięcie całego dokumentu HTML.

Strona w języku

HTML

  - nowy wiersz, ta komenda działa jak Enter

 tekst  - zmienia czcionkę na pogrubioną

 tekst  - zmienia czcionkę na pochyloną (kursywa)

 tekst  - zmienia czcionkę na podkreśloną

<s> tekst </s> - przekreśla dany tekst

 tekst  - włączenie indeksu dolnego

 tekst  - włączenie indeksu górnego

Formatowanie

Formatowanie tekstu

Strona w języku

HTML

 ustawienie rodzaju czcionki 

font size=”7”> - ustawienie rozmiaru czcionki na 7 

Język HTML oferuje tylko 7 stopni wielkości znaku, czyli od 1 do 7

 tekst - wyrównanie teksu do lewej strony

 tekst - wyrównanie teksu do prawej strony

 tekst - wyśrodkowanie tekstu

 tekst - wyjustowanie tekstu

<body background=”tlo.jpg”> - ustawienie rysunku jako tło strony

Formatowanie

Formatowanie tekstu

Strona w języku

HTML

Kolory czcionki

Do zmiany koloru czcionki służy komenda

 tekst 

PRZYKŁADOWA NAZWA

KOD KOLORU

”SILVER”

”#C0C0C”

”GRAY”

”#808080”

”RED”

”#800000”

”PURPLE

”#800080”

”PINK”

”#FF00FF”

”GREEN”

”#008000”

”LIME”

”#00FF00”

”YELLOW”

”#FFFF00”

”NAVY”

”#000080”

”BLUE”

”#0000FF”

”AQUA”

”#00FFFF”

Strona w języku

HTML

Rysunki na stronie

Do umieszczenia rysunku w tekście strony HTML używa się komendy <img>

Komenda <img> posiada wiele

atrybutów

, trzy najczęściej używane to:

src – atrybut, określający położenie pliku zawierającego wyświetlany rysunek
width – określa szerokość rysunku
height – określa długość rysunku

Aby umieścić rysunek na stronie internetowej należy użyć komendy:
<img src=”nazwa rysunku.jego rozszerzenie np. jpg”>

Strona w języku

HTML

<ul>
<li> Kot </li>
<li> Pies </li>
<li> Tygrys <li>
<li> Kolejne pozycje na liście
<li>
</ul>

• Kot

• Pies

• Tygrys

• Lew

Lista

wypunktowana

Tworzenie listy wypunktowanej polega na objęciu wszystkich
pozycji listy parą znaczników <ul>

<li> pozycja listy </li>

Strona w języku

HTML

<ol>
<li> banany </li>
<li> wiśnie</li>
<li> śliwki <li>
<li> Kolejne pozycje na liście
<li>
</ol>

1. banany
2. wiśnie
3. śliwki

Lista numerowana

Tworzenie listy numerowanej polega na objęciu wszystkich
pozycji listy parą znaczników <ol>

<li> pozycja listy </li>

Strona w języku

HTML

Typowa tabela ma następującą budowę:

<table>
<tr>
<td> komórka </td>
<td> komórka </td>
</tr>
<tr>
<td> komórka </td>
<td> komórka </td>
</tr>
</table>

Tabele

Strona w języku

HTML

Użyte w powyższym kodzie znaki oznaczają
kolejno:

<table>

definiuje tabelę

<tr>

definiuje rząd tabeli

<td>

definiuje komórkę w wierszu tabeli

Tabele

Strona w języku

HTML

Odnośniki

Odnośniki do innych stron

<a href =”adres strony” target=”top”>

Tekst

</a>

wyżej wymieniona strona załaduje się w tym samym
Oknie, ponieważ w składni jest predefiniowana nazwa okna „top”

<a href =”adres strony” target=”blank”>

Tekst

</a>

tutaj strona załaduje się w nowym oknie, ponieważ w składni jest
predefiniowana nazwa okna „blank”

Strona w języku

HTML

Odnośniki

Odnośniki do pliku skompresowanego

Aby utworzyć link do jakiegoś pliku np. RAR należy użyć:

<a href=”

http://

www.adres.pl/plik.exe”>

Klikniecie na tego typu link powoduje „ściągniecie” pliku na
dysk lokalny

Odnośniki do adresu e-mail

<a href=mailto:adres_email@adres.pl>Napisz do
mnie </a>

Na naszej stronie zobaczymy tekst Napisz do mnie. Kliknięcie w
niego spowoduje uruchomienie programu pocztowego, a w pole
adresata zostanie wpisany ww. adres e-mail.

Document Outline

Slide 1
Slide 2
Slide 3
Slide 4
Slide 5
Slide 6
Slide 7
Slide 8
Slide 9
Slide 10
Slide 11
Slide 12
Slide 13
Slide 14
Slide 15

003074 osi 01 prezentacja wrona tworzenie stron internetowych w jezyku htmlid 2288 ppt

Document Outline