Wielkość czcionki
Gdyby autorowi strony znudził się tekst, w którym czcionka
ma ten sam kolor i wielkość, zawsze może się posłużyć
dodatkowymi poleceniami, zmieniającymi obie cechy. W
dokumentach HTML stosuje się nieco inną definicję wielkości
czcionki niż przyjęta w edytorach tekstów. Podstawowa
czcionka ma wielkość 3 jednostek (nie mylić z wielkością w
punktach typograficznych) i jest zazwyczaj wyświetlana w
przeglądarkach WWW jako czcionka 10-12-punktowa.
Przeglądarki pozwalają na ogół zdefiniować, jaka wartość
punktowa odpowiada czcionce o wielkości 3. W dokumencie
możemy stosować czcionkę o wielkości od 1 do 7. Im większa
wartość, tym większa czcionka w przeglądarce.
Wielkość czcionki
Polecenie, które określa wielkość czcionki, ma
następującą postać:
<FONT SIZE="x">Tekst objęty definicją</FONT>
x = 1...7
Wielkość czcionki
Gdy w taki właśnie sposób definiujemy wielkość
czcionki, nadajemy jej wartość absolutną. Możemy
jednak także nadać wartość relatywną, czyli
względną, podając wielkość zmiany. Skoro czcionka
standardowa ma wielkość 3, możemy dodać do niej co
najwyżej 4 jednostki lub odjąć co najwyżej 2. Gdyby
czcionka podstawowa miała wielkość 1, moglibyśmy
dodać 6, ale już niczego nie moglibyśmy odejmować.
<FONT SIZE="+x">Tekst objęty definicją </FONT>
<FONT SIZE="-x">Tekst objęty definicją </FONT>
x = 1...6
Wielkość czcionki
Gdy jakiś fragment tekstu obejmiemy definicją <FONT
SIZE=+2> </FONT>, będzie on miał wielkość 5, gdyż
dodajemy 2 jednostki do wielkości podstawowej. Gdy
użyjemy polecenia <FONT SIZE=-1> </FONT>, tekst
będzie miał wielkość 2.
W ten sposób możemy manipulować wysokością
czcionki w tekście, uwypuklając jakieś fragmenty. Jest
to wygodne, gdyż możemy zmienić wielkość czcionki
wewnątrz akapitu, do czego nie nadaje się definicja
tytułu.
ZADANIE 9
Otwórz plik zadanie8.html i zapisz pod
nazwą zadanie9.html. Wstaw dowolny
tekst. Zmień wielkość absolutną liter
we fragmencie tekst na 7. Inny
fragment zmniejsz relatywnie o 1.
Kolor czcionki
W analogiczny sposób możemy zmieniać kolor czcionki.
Posługujemy się tutaj poleceniem:
<FONT COLOR="kolor">Tekst objęty
poleceniem</FONT>
Kolory możemy definiować w postaci tradycyjnej, a
więc za pomocą wartości szesnastkowych (np. kolor
biały ma wartość #FFFFFF, a czarny #000000), albo za
pomocą ich nazw. Oto lista szesnastu podstawowych
barw:
ZADANIE 10
Otwórz plik zadanie9.html i zapisz go
pod nazwą zadanie10.html. Zmień
kolory trzech fragmentów tekstu.
Grafika na stronie
Strony WWW zawierają zwykle grafikę, która bardzo
urozmaica ich czytanie - pod warunkiem oczywiście, że
korzystamy z graficznego systemu operacyjnego. Niektórzy
autorzy stron tak się zatracają w ozdabianiu stron, że
zapominają o przepustowości łączy internetowych. Gdy
czytelnik strony nie wyłączy w swojej przeglądarce funkcji
wczytywania grafiki, może stracić dużo czasu i nerwów,
oczekując na wczytanie tak spreparowanej strony. Na
szczęście za następnym razem przeglądarka sięga do
katalogu cache, gdzie gromadzą się grafiki z Internetu, co
znacznie przyspieszy transmisję zawartości strony.
Niemniej jednak warto z umiarem stosować graficzne
ozdobniki, zwłaszcza gdy nie niosą żadnych istotnych
treści.
Grafika na stronie
Grafikę możemy wprowadzić za pomocą polecenia:
<IMG SRC="nazwa_pliku">
W najprostszym przypadku, gdy obrazek znajduje się w
tym samym katalogu co dokument, wystarczy podać
jego nazwę. Gdy grafiki gromadzimy na serwerze w
odrębnym katalogu, konieczne jest podanie ścieżki
dostępu. Na przykład:
<IMG SRC="../gambler/gambler.gif">
Grafika na stronie
Przy takim zdefiniowaniu obrazek pojawi się z lewej
strony, a tekst znajdzie się pod obrazkiem. Jeżeli
chcemy by obrazek był z lewej strony a tekst znajdował
obok obrazka należy użyć polecenia
<IMG SRC="nazwa_pliku" align=left>
Jeżeli chcemy wyrównać obrazek do prawej musimy
użyć polecenia:
<IMG SRC="nazwa_pliku" align=right>.
ZADANIE 11
Otwórz plik zadanie10.html i zapisz go
pod nazwą zadanie11.html. Z folderu
obrazki wstaw w trzech różnych
miejscach trzy pliki graficzne z lewej
tak by tekst znalazł się nad i pod
obrazkiem, z lewej i z prawej strony tak
by tekst przylegał do zdjęcia.
Odsyłacze
Charakterystyczną cechą Internetu jest obecność na stronach
hipertekstowych odsyłaczy do innych stron, które znajdują się
w światowej sieci. W gruncie rzeczy czytelnik dokumentu nie
musi wcale wiedzieć, gdzie znajdują się te strony - ważne
jest, aby miał do nich łatwy dostęp. Na tym polega istota
hipertekstu - jakiś temat może być opisany za pomocą stron
tworzonych przez różnych autorów, mieszkających w różnych
krajach, nawet często nie znających się wzajemnie. Gdy na
zbudowanych przez nich stronach znajdą się odsyłacze, ich
wspólne zainteresowania zostaną zjednoczone za pomocą
hipertekstu, który uczyni te strony jedną całością. Czytelnik
jakiegoś dokumentu będzie po prostu za pomocą kliknięć
myszką na odsyłaczach przenosić się do różnych miejsc w
Internecie, skacząc np. z Polski do Japonii, z Japonii do USA, a
stamtąd do Francji. Z jego punktu widzenia jest zupełnie
obojętne, gdzie strony się znajdują. Dla niego ważny jest
łatwy dostęp do informacji.
Odsyłacze
Odsyłacz do innej strony jest tworzony za
pomocą polecenia:
<A HREF="adres.strony.internetowej">Jakaś
nazwa tej strony</A>
Przykładowy adres mógłby wyglądać
następująco:
<A HREF="http://www.wp.pl">Wirtualna
Polska </A>
Odsyłacze
Odsyłacz do poczty tworzymy za pomocą polecenia:
<A HREF="mailto:autor@jego.adres">Imię i
nazwisko</A>
Na przykład:
<A HREF="mailto:pwimmer@www-
mag.com.pl.">Redaktor</A>
Napis mailto daje sygnał przeglądarce WWW, że ma
uruchomić pocztę elektroniczną. Navigator wywoła
swój własny moduł pocztowy Mail, Internet Explorer
zaś skorzysta z Outlook Express (albo np. z Outlook
98, jeśli jest on domyślnym programem pocztowym).
Także i tutaj stosujmy konsekwentnie w adresie
cudzysłów.
Odsyłacze
Fragment w postaci:
Jeśli masz jakieś uwagi, napisz do <A
HREF="mailto:pwimmer@www-
mag.com.pl.pl">autora strony</A>
zostanie przedstawiony w
przeglądarce następująco:
Jeśli masz jakieś uwagi, napisz do
ZADANIE 12
Otwórz plik zadanie11.html i zapisz go
pod nazwą zadanie12.html. Wstaw linki
do
dwóch
dowolnych
stron
internetowych i do swojej poczty. Jeżeli
nie posiadasz własnej skrzynki to
wstaw
odesłanie
do
skrzynki
praceklasowe@wp.pl