kurs html rozdział IV

background image

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.

background image

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

background image

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

background image

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.

background image

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.

background image

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:

kliknij tutaj

background image

ZADANIE 10

Otwórz plik zadanie9.html i zapisz go

pod nazwą zadanie10.html. Zmień
kolory trzech fragmentów tekstu.

background image

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.

background image

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">

background image

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>.

background image

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.

background image

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.

background image

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>

background image

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.

background image

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

autora strony

background image

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


Document Outline


Wyszukiwarka

Podobne podstrony:
kurs html rozdział II
kurs html rozdział VIII
kurs html rozdział V
kurs html rozdział I
kurs html rozdział IX
kurs html rozdział VII
kurs html rozdział VI
kurs html rozdział II
Łobocki Rozdział IV, Pedagogika Przedszkolna i Wczesnoszkolna Uniwersytet Pedagogiczny Licencjat, Te
Rozdzial IV Nessie
ROZDZIAŁ IV
Kurs HTML HTML BODY i META
Rozdział IV

więcej podobnych podstron