<html> </html> <body> </body> <p> [</p>] <br> <html> <head> </head> <body> </body> </html> Materiały dydaktyczne 1/5

Wielkość: px

Rozpocząć pokaz od strony:

Download "<html> </html> <body> </body> <p> [</p>] <br> <html> <head> </head> <body> </body> </html> Materiały dydaktyczne 1/5"

Iwona Szczepańska
8 lat temu
Przeglądów:

1 PODSTAWOWE INFORMACJE HTML (HyperText Mark-up Language) język programowanie, który pozwala na publikowanie treści w sieci WWW. Nie jest to klasyczny język liniowy (w HTML mamy dostęp w każdym miejscu do dowolnej opcji). Jest to język, który wykorzystuje znaczniki aby odróżnić zwykły tekst od instrukcji sterujących. Z językiem tym związany jest ściśle pojęcie DTD (Definicji Typu Dokumentu), która pozwala w sposób precyzyjny zasady stosowania znaczników. W języku HTML stosuje się znaczniki aby przeglądarka odróżniła je od zwykłego tekstu. Znaczniki ujmowane są pomiędzy znakami specjalnymi < oraz > : <znacznik otw.> zawartość </znacznik zamyk.> Nie wszystkie znaczniki składają się z tych dwóch typów. Są w języku HTML takie, które zawierają tylko znacznik otwierający i opcjonalnie znacznik zamykający. Przykład znaczników <p> [</p>] <br> Znaczniki nie rozróżniają małych lub wielkich liter, jednak dobrym przyzwyczajeniem jest używanie małych liter ze względu na standardy dokumentów www oraz założenia nowych języków XHTML. Każdy dokument HTML składa się z 3 sekcji: - sekcji która odpowiedzialna jest za prawidłowe zinterpretowanie dokumentu jako dokumentu www - sekcji, która dotyczy nagłówka strony, tytułu, ustawień znaków wyboru języka itd. ogólnie mówiąc pozwala definiować ustawienia strony - sekcji, która to sekcja jest sercem dokumentu HTML, to tutaj zawarte są treści wyświetlane na stronie www. Każdy dokument musi posiadać w prawidłowy sposób umieszczone te 3 sekcje: SEKCJA Sekcja ta pozwala także zdefiniować tytuł strony, który może się składać tylko z tekstu. jest to możliwe za pomocą znaczników <title></title>. To co zostanie napisane pomiędzy znacznikami zostanie wyświetlone jako tytuł strony www (tytuł może być tylko jeden). Sekcja ta zawiera także podstawowe informacje na temat dokumentu i umożliwia ich konfigurowanie. Do tego służą znaczniki <meta>, które pozwalają m.in.: - ustawiać opis dokumentu, Materiały dydaktyczne 1/5

Z językiem tym związany jest ściśle pojęcie DTD (Definicji Typu Dokumentu), która pozwala w sposób precyzyjny zasady stosowania znaczników.

2 - ustalać autora dokumentu, - wybrać domyślne kodowanie znaków dla strony, - wybrać słowa kluczowe dla strony itd. Przykład: <meta name= description content= Strona internetowa - Technologie Internetowe > <meta name= keywords content= Technologie internetowe, strona internetowa, język HTML > Oprócz zaprezentowanych elementów znacznika meta stosuje się m.in. elementy: autor, revised, generator. Znaczniki <meta> może zostać także wykorzystany gdy chcemy skierować użytkownika automatycznie w inne miejsce niż aktualne: <meta http-equiv= Refresh content= 5; url= > <p>za chwile zostaniesz przekierowany do strony Znaczniki <meta> umożliwiają także wybór sposobu kodowania znaków na stronie www: <meta http-equiv= content-type content= text/html charset=windows-1250 > <meta http-equiv= content-type content= text/html charset=iso > Podstawowe zastosowanie znaczników używanych w sekcji : - znaczniki nagłówków <h1> <h6> <title> Technologie internetowe </title> <h1>akapit 1-szy</h1>  <h2>akapit 2-gi</h2>  aby wyśrodkować zawartość nagłówka na stronie stosuje się znacznik <center></center> <center><h1>1-szy nagłówek</h1></center> - tworzenie akapitów <p> </p> Materiały dydaktyczne 2/5

zaprezentowanych elementów znacznika meta stosuje się m.in. elementy: autor, revised, generator.

3 <title>technologie internetowe</title> <h1 align="center">akapit 1-szy</h1>   <p>jest to tekst w ramach akapitu pierwszego. Przedmiot Technologie internetowe, dokument testowy wprowadzenie w programowanie w HTML.</p> <h2 align="center">akapit 2-gi</h2>   <p>teraz mamy drugi fragment tekstu, który umieszczony jestw akapicie drugim. Zdanie testowe i przykładowe dla pokazania działania znaczników akapitu.</p> - tworzenie lini poziomych (separatory tekstu) <hr> <title>technologie internetowe</title> <h1 align="center">akapit 1-szy</h1>   <p>jest to tekst w ramach akapitu pierwszego. Przedmiot Technologie internetowe, dokument testowy wprowadzenie w programowanie w HTML.</p> <h2 align="center">akapit 2-gi</h2>  <hr>  <p>teraz mamy drugi fragment tekstu, który umieszczony jestw akapicie drugim. Zdanie testowe i przykładowe dla pokazania działania znaczników akapitu.</p> wygląd lini poziomej może być modyfikowany za pomocą elementów size grubość lini (piksele), width - długość lini (procenty/ piksele), align - wyrównanie (center/left/wright). - znaczniki łamania linii <br> - znaczniki prezentacji <pre> </pre> <pre> for (i=1; i<20; 1++) print I; </pre> printa[i]; Materiały dydaktyczne 3/5

-- to jest drugi akapit tekstu--> <p>teraz mamy drugi fragment tekstu, który umieszczony jestw akapicie drugim. Zdanie testowe i przykładowe dla pokazania działania znaczników akapitu.

4 - znaczniki formatujące tekst: <b></b> - pogrubienia <i></i> - kursywa <tt></tt> - czcionka maszynowa <strong></strong> - wyraźne pogrubienie <big></big> oraz <small></small> - czcionka większa i mniejsza od standardowej <sup></sup> oraz <sub></sub> - indeks dolny i górny <code></code> - wyświetlany tekst jest kodem programu i ma być prezentowany czcionką o stałej szerokości oraz wiele innych. Zaletą języka HTML jest to, że do każdego tekstu można stosować wiele znaczników. Jedyna zasadą w takim przypadku jest to aby znaczniki występowały parami: <b><i><tt>jakis TEKST</tt></i></b> - prawidłowo <b><i><tt>jakis TEKST</b></i></tt> - BŁĄD!!! - znaczniki różnego rodzaju list wypunktowanej numerowanej <li>pierwsze pole</li> <li>drugiew pole</li> <ol> <li>pierwsze pole</li> <li>drugiew pole</li> </ol> definicji <dl> <dt>1-sza definicja na liście</dt> <dd>a tutaj jej opis</dd> <dt>2-ga definicja na liście</dt> <dd>a tutaj opis 2-giewj definicji</dd> </dl> <dl></dl> - znaczniki otwierające <dt></dt> znaczniki terminów <dd></dd> znaczniki definicji <title>lista numerowana z podpunktami</title> <h2>lista numerowana z podpunktami:</h2> <ol> <li>pierwsza pozycja listy</li><hr align="left" width="200"> Materiały dydaktyczne 4/5

Zaletą języka HTML jest to, że do każdego tekstu można stosować wiele znaczników.

5 <li>punkt drugi</li><br><br> <li>druga pozycja listy</li><hr align="left" width="200"> <li>punkt drugi</li><br><br> <li>trzecia pozycja listy</li><hr align="left" width="200"> <li>punkt drugi</li> </ol> Materiały dydaktyczne 5/5

drugi</li><br><br> <li>trzecia pozycja drugi</li> </ol>

Podobne dokumenty

Ćwiczenie 2 Tekst podstawowe znaczniki.

Ćwiczenie 2 Tekst podstawowe znaczniki. Ćwiczenie 2 poświęcone jest formatowaniu tekstu za pomocą znaczników. AŜeby uzyskać poŝądany wygląd tekstu musimy posłuŝyć się określonymi znacznikami. Ćwiczenie