Zadanie 1 (podstawowe elementy)
Stwórz dokument HTML w Notatniku. Wprowadź szkielet dokumentu, a następnie elementy:
a) Tekst pogrubiony: Ten tekst musi zostać pogrubiony. <b>
b) Przejście do nowej linii <br> Od tej chwili dzielimy wszystkie linie.
c) Tekst pochylony: Pochylenie tekstu <i>
d) Nagłówki: <h1> <h2>
To jest nagłówek
To jest pod-nagłówek
W tym miejscu stwórz nowy akapit <p>
e) Tekst podkreślony: Czcionka podkreślona <u>
f) Tekst przekreślony: To jest czcionka przekreślona <s>
g) Tekst dużą czcionką:
To jest duża czcionka
<big>h) Indeks górny: To jest napis z indeksem górnym <sup>
i) Indeks dolny: To jest napis z indeksem dolnym <sub>
j) Linia pozioma: <hr>
Zapisz dokument z rozszerzeniem htm i sprawdź jak działa w przeglądarce internetowej.
Zadanie 2 (atrybuty)
a) Zmień kolor stworzonej strony na zielony.
<body style="background-color: kolor;">
b) Zmień kolor czcionki nagłówka na oliwkowy (olive) color – kolor, wartość Biały: #ffffff (white)
Czarny: #000000 (zeros) Czerwony: #ff0000 Niebieski: #0000ff Zielony: #00ff00 Żółty: #ffff00
c) Zmień krój czcionki pogrubionego tekstu na Time face - krój czcionki, wartość: Arial, Time, Courier d) Zmień krój czcionki tekstu dużą czcionką na Arial
e) Zapisz następujący tekst i sformatuj go w odpowiedni sposób:
To jest tekst napisany czerwoną czcionką Arial o rozmiarze 4.
size - wielkość czcionki, wartość od 1 do 7
f) Wstaw w nowym akapicie tekst następującej treści, To jest tekst objęty obramowaniem
Obramuj tekst <fieldset> i dodaj opis do ramki <legend> o treści Obramowanie.
g) Wyśrodkuj powyższy tekst <center>
align – wyrównanie np. akapitu, wartość: center, right, left, justify Zadanie 3 (odsyłacze)
Wstaw odsyłacze (hiperłącza) do stron stworzonych przez Ciebie na poprzednich zajęciach.
Nazwami hiperłączy niech będą: Strona główna, Kontakt, Działy. Pamiętaj o umieszczeniu krótkiego opisu każdego odnośnika. Sprawdź działanie odnośników.
Zadanie 4 (meta)
Sprawdź na stronie głównej UMCS jakie słowa kluczowe, opis i kodowanie wpisał jej autor w atrybutach elementu META. W tym celu otwórz stronę w przeglądarce internetowej, kliknij widok źródło strony.
Zadanie 5 (meta)
Co mogą definiować następujące polecenia:
a) <META name="author" content="Jan Nowak">
b)<META name="reply-to" content="janek@nowak.com">
c) <META name="keywords" content="kot, pies, lis">
d) <META name="date" content="Wed, 25 May 2005 10:05:32 GMT">
Wstaw obowiązkowe elementy strony.
Kodowanie witryny wykonanej w języku polskim:
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
Definicja języka dokumentu
<META http-equiv="Content-Language" content="pl,en,fr">
Opis strony
<META name="description" content="Opis zawartości witryny liczący około 100-200 znaków.">
Tytuł strony – Strona próbna <title>
Sprawdź czy polskie znaki działają poprawnie.
Dokonaj konwersji strony jeśli nie działają:
http://www.kurshtml.boo.pl/html/polskie_znaki,zielony.html
Zadanie 6 (rysunki)
Wstaw obrazek z poprzednich zajęć do swojego pliku. Obrazek ma posiadać tytuł Książki i obramowanie (border) dowolnej szerokości.
Zadanie 7 (wykazy)
Stwórz kilka list stosując poniższe wskazówki:
a) Wypunktowanie - różne typy
<ul type="rodzaj">
<li>Punkt pierwszy</li>
<li>Punkt drugi</li>
<li>Punkt trzeci</li> </ul>
gdzie jako "rodzaj" należy podać:
* "disc" - (domyślny) - koło * "circle" - okrąg
* "square" - wypełniony kwadrat b) Wykaz numerowany - różne typy
<ol type="rodzaj numeracji">
<li>Punkt pierwszy</li>
<li>Punkt drugi</li>
<li>Punkt trzeci</li>
</ol>
gdzie jako "rodzaj numeracji" należy podać:
* "1" (domyślny) - numeracja według liczb arabskich * "I" - według dużych liczb rzymskich
* "i" - według małych liczb rzymskich * "a" - według małych liter
* "A" - według dużych liter Zadanie 8 (tabele)
Na stronie umieść dwie kolumny tekstu, jedną z nich wyrównaj do prawej, a drugą do lewej strony (align). W tym celu stwórz tabelę zajmującą 100% strony (width) bez obramowania, o dwóch komórkach i jednym wierszu.