Kurs HTML
Zacznijmy od prezentacji całkiem czystego dokumentu HTML. Taki plik możesz stworzyć nawet za pomocą bardzo prostego Notatnika, a następnie zapisać go z rozszerzeniem .html lub .htm.(Kod HTML zaznaczony jest kolorem żółtym). <HTML> - informuje o dokumencie napisanym w języku HTML.<HEAD> - nagłówek pliku.<META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=Windows-1250"> - kod.<TITLE> dowolny tekst </TITLE> - tytuł strony.</HEAD> - zamyka nagłówek.<BODY> dowolny tekst </BODY> - tekst dokumentu.</HTML> - zamknięcie dokumentu HTML.A teraz zajmijmy się zmianą wyglądu czcionki, koloru tekstu, liniami oraz wykazami. Obok znacznika podam jego znaczenie.
Znaczniki
Wszystkie znaczniki wpisujemy pomiędzy polecenia <BODY> i </BODY>. Wielkość liter wpisanych znaczników nie ma znaczenia. Znaczniki muszą leżeć bezpośrednio przy nawiasach ostrych.
<BR> - umożliwia przejście do następnej linii.
<P> i </P> - tworzy akapit.
<B> i </B> - pogrubienie czcionki, widać to na całym tekście tu zamieszczonym.
<I> i </I> - pochylenie czcionki.
<U> i </U> - podkreślenie czcionki.
<STRIKE> i </STRIKE> - przekreślenie czcionki.
<BLINK> i </BLINK> - czcionka migotająca akceptowana przez przeglądarkę Netscape.
<VAR> i </VAR> - czcionka zmienna.
<TT> i </TT> - czcionka o stałej szerokości znaku.
<SUP> i </SUP> - indeks górny.
<SUB> i </SUB> - indeks dolny.
<BIG> i </BIG> - duża czcionka.
<SMALL> i </SMALL> - mała czcionka.
<CITE> i </CITE> - Cytat.
<EM> i </EM> - czcionka wyróżniona.
<CODE> i </CODE> - Czcionka kodowa.
<KBD> i </KBD> - Czcionka klawiaturowa.
<SAMP> i </SAMP> - czcionka przykładowa.
<CENTER> i </CENTER> - wyśrodkowanie.
Stopnie tekstu
<HX> - określa stopień tekstu (występuje 6 możliwości), gdzie "X" tam interesująca nas cyfra.Np:
Definiowanie czcionek
<FONT SIZE="ROZMIAR"> - rozmiar kroju czcionki, gdzie ROZMIAR tam liczba go określająca np.To jest tekst o rozmiarze 2.To jest tekst o rozmiarze 3.To jest tekst o rozmiarze 4.To jest tekst o rozmiarze 5.
<FONT COLOR="KOLOR"> i </FONT>- kolor czcionki. Ta sama zasada co przy linii oddzielającej.
<FONT FACE="KRÓJ"> i </FONT> - pozwala na zmianę kroju czcionki np. na: ARIAL, COURIER.Przy podawaniu tej komendy należy być ostrożnym, gdyż nie wiemy jakimi czcionkami odbiorca dysponuje. Możemy jednak podać parę krojów po przecinku np:
<FONT FACE="ARIAL CE", Arial, Halvetica>
Definiowanie lini
<HR> - dodanie oddzielającej linii do tekstu.
<HR COLOR="KOLOR"> - linia oddzielająca o zdefiniowanym kolorze, gdzie KOLOR tam angielska nazwa koloru np.
· Red
· Green
· Lime
· Yellow
· Pink
· Purple
· Gray
· Silver
· White ( biały niewidoczny ze względu na kolor kartki)
· Orange
· Gold
· Aqua
· Navyblue
· Blue
· Lightgreen
· Darkblue
· Olive
· Teal
· Maroon
· Fuchsia
Kolory można także definiować za pomocą systemu RGB - skrót od: RED , GREEN , BLUE. Ilość każdego koloru definiują dwie cyfry lub połączenie cyfr i liter ( litera A = 10 , B =11 , C = 12 , D = 13 , E =14 , F = 15 ) , czyli musi ich być sześć np.
1. 005050
2. AABB50
3. 44A5A5
4. 607080
5. AB4030
6. ABCDEF
Np:
<HR COLOR="Red">
<HR COLOR="EE0000">
<HR COLOR="DD0000">
<HR COLOR="CC0010">
<HR SIZE="GRUBOŚĆ"> - linia oddzielająca o zdefiniowanej grubości. Grubość podajemy jedynie za pomocą cyfr. Gdzie GRUBOŚĆ tam interesująca nas cyfra (liczba pikseli).Np:
<HR SIZE="2">
<HR SIZE="5">
<HR SIZE="10">
<HR WIDTH="DŁUGOŚĆ"> - długość linii w pikselach.Np:
<HR WIDTH="100">
<HR WIDTH="200">
<HR WIDTH="300">
<HR COLOR="KOLOR" HR SIZE="GRUBOŚĆ" HR WIDTH="DŁUGOŚĆ"> - przykład połączenia kilku znaczników.
<HR COLOR="FF0000" HR SIZE="4" HR WIDTH="400">
Wykaz punktowany
<UL> i <LI> i </LI> i </UL> - unordered list - styl wypunktowania, który widać przy angielskich nazwach kolorów. Znacznik <LI> trzeba podać przy tekście który chcemy wypunktować.Struktura takiej listy wygląda następująco:<UL><LI> - 1 punkt</LI><LI> - 2 punkt</LI><LI> - 3 punkt</LI></UL>A oto rezultat:
· - 1 punkt
· - 2 punkt
· - 3 punkt
W przypadku takiej listy możemy dodatkowo zdefiniować symbol graficzny np:<UL TYPE="square"><LI> - 1 punkt</LI><LI> - 2 punkt</LI><LI> - 3 punkt</LI></UL>A oto rezultat:
§ - 1 punkt
§ - 2 punkt
§ - 3 punkt
lub:<UL TYPE="circle"><LI> - 1 punkt</LI><LI> - 2 punkt</LI><LI> - 3 punkt</LI></UL>A oto rezultat:
o - 1 punkt
o - 2 punkt
o - 3 punkt
Jeśli zechcemy lista może zostać wyświetlona na różnych poziomach np:<UL><LI> - 1 punkt</LI><UL><LI> - 1 podpunkt</LI></UL><LI> - 2 punkt</UL>A oto rezultat:
o - 1 podpunkt
Wykaz numerowany
<OL> i <LI> i </LI> i </OL> - ordered list - styl wynumerowania, który widać przy kolorach systemu RGB. Znacznik <LI> trzeba podać przy tekście który chcemy wynumerować.Struktura takiej listy wygląda następująco:<OL><LI> - 1 punkt</LI><LI> - 2 punkt</LI><LI> - 3 punkt</LI></OL>Rezultat:
1. - 1 punkt
2. - 2 punkt
3. - 3 punkt
Lista może rozpoczynać się od dowolnego numeru, w tym celu wykorzystamy parametr<OL START="X">, gdzie X tam numer rozpoczynający listę np:<OL START="10"><LI> - 1 punkt</LI><LI> - 2 punkt</LI><LI> - 3 punkt</LI></OL>Rezultat:
10. - 1 punkt
11. - 2 punkt
12. - 3 punkt
Lista może zostać ułożona alfabetyczne, służy do tego polecenie<OL TYPE=a> - z małych liter <OL TYPE=A> - z dużych liter. Np:<OL TYPE=a><LI> - 1 punkt</LI><LI> - 2 punkt</LI><LI> - 3 punkt</LI></OL>
Rezultat:
a. - 1 punkt
b. - 2 punkt
c. - 3 punkt
Lub według liczebników rzymskich, polecenie<OL TYPE=i> - małe liczebniki <OL TYPE=I> - duże liczebniki. Np:<OL TYPE=i><LI> - 1 punkt</LI><LI> - 2 punkt</LI><LI> - 3 punkt</LI></OL>Rezultat:
i. - 1 punkt
ii. - 2 punkt
iii. - 3 punkt
Tak jak i lista typu <UL> tak i ta moze zostać ułożona na różnych poziomach, z tym że zamiast znacznika <UL> wpisujemy <OL>.
rafulus