13. ramki - strona główna

Transkrypt

KURS HTML
13. RAMKI
Ramka, to tak naprawdę strona, dzięki której w jednym okienku przeglądarki mogą
pojawić się dwie strony, lub więcej. JeŜeli nie korzystamy z Ŝadnych skryptów
przechowujących pewną treść strony to na pewno nam się przydadzą. Do czego? Np. do
umieszczenia w jednej z ramek spisu treści, który po kliknięciu na wybrany dział otwiera nam
stronę w ramce przeznaczonej do prezentowania większej ilości treści.
MoŜna takŜe umieścić logo serwisu, albo jakąś stopkę nawigacyjną, aby była zawsze
widoczna. Ramki mają własne paski przewijania więc starajmy się, aby na rozdzielczości
800x600 pasek przewijania był tylko dla jednej – prawej ramki, gdyŜ głupio wyglądają strony
z paskiem przewijania w środku strony, bądź nawet kilkoma paskami przewijania. Są dwa
typy ramek – ramki standardowe i ramki wewnętrzne (takŜe zwane wbudowane). Najpierw
umówmy ramki standardowe.
Ramki standardowe
Ramki standardowe składają się z wielu znaczników i atrybutów. W przeciwieństwie do
poznanych juŜ nam instrukcji, jak poprawnie tworzyć stronę ramki większość swoich
znaczników mają pomiędzy znacznikami </HEAD, a <BODY> więc nie są w Ŝadnej sekcji.
Jeden natomiast znacznik zawiera w sobie sekcje <BODY>, która wyświetla się
uŜytkownikom przeglądarek nie uŜywających ramek. Główna konstrukcja ramek znajduje się
pomiędzy znacznikiem <FRAMESET>. Ma on dwa atrybuty, których wartości wyglądają
tak samo i to samo znaczą:
•
COLS - ramki pionowe
•
ROWS - ramki poziome
Wartość to rozmiar ramek. W zaleŜności od ilości chcianych ramek, które później
"zbudujemy" umieszczamy określoną ilość liczb, które są pikselami, jednakŜe w HTMLu
jednostek nigdy nie podajemy. JeŜeli chcemy moŜemy takŜe podać procenty. JeŜeli chcemy,
aby jedna ramka miała określony rozmiar, a druga dopasowywała się do rozmiarów okienka
zamiast cyfry umieszczamy zmiennik w postaci gwiazdki * , co zalecam robić, gdyŜ jeŜeli
przeglądarka moŜe wyświetlić więcej niŜ jej kaŜemy efekt moŜe być paskudny.
www.INFORMATYKA.cba.pl
KURS HTML
Określanie ilości ramek i ładowanego dokumentu
Czas zbudować same ramki. Pomiędzy znacznikiem <FRAMESET> umieszczamy tyle
znaczników <FRAME>, ile chcemy mieć ramek. Pamiętajmy, Ŝe ramki muszą być
odpowiedniej kolejności, w zaleŜności od ustawionej wcześniej wartości ich rozmiaru!
NajwaŜniejszym atrybutem jest NAME, którego wartość oznacza nazwę ramki. Dzięki temu,
jeŜeli klikniemy z ramki, która jest spisem treści, na taki link:
<A HREF="dzial.htm" TARGET="ramka">Dział</A>
strona zostanie otworzona w ramce przeznaczonej na prezentowanie treści, pod warunkiem,
Ŝe będzie ona nazwana "ramka". Kolejnym waŜnym atrybutem jest SRC, w którego wartości
umieszczamy ścieŜkę do dokumentu, który zostanie otwarty w ramce po załadowaniu ramki.
ChociaŜ rozmiar ramki został określony to i tak uŜytkownik moŜe go zmienić po najechaniu
na pasek rozdzielający ramki. Aby temu zapobiec musimy uŜyć atrybutu NORESIZE. Za
pomocą SCROLLING decydujemy o zachowaniu się pasków przewijania. Wartości tego
atrybutu to:
•
yes - pasek przewijania zawsze widoczny
•
no - pasek przewijania zawsze niewidoczny (nawet jeŜeli zawartość ramki jest
większa, niŜ sama ramka)
•
auto - pasek przewijania widoczny, jeŜeli zawartość ramki jest większa niŜ sama
ramka (jeŜeli zawartość ramki jest mniejsza, pasek nie pojawi się)
Ostatnim atrybutem wartym opisania jest FRAMEBORDER (ang. obramowanie ramki),
który decyduje o pojawieniu się, bądź nie pojawieniu się obramowania ramki. Jego wartości
to:
•
yes (takŜe 1) –obramowania
•
no (takŜe 0) – brak obramowania
Uwaga: moŜe wydawać się to dziwne, Ŝe jeŜeli mamy dwie ramki musimy uŜywać w
kaŜdej z nich atrybutów NORESIZE i FRAMEBORDER, aby pozbyć się obramowania i
moŜliwości przewijania ramki. Wszystko jest dokładnie przemyślane. JeŜeli mielibyśmy np.
trzy ramki i chcielibyśmy, aby tylko dwie ostatnie nie mogły być przewijane i, aby były bez
obramowania, to wpisując te atrybuty do środkowej ramki, to skąd przeglądarka wiedziałaby,
czy usunąć obramowanie pomiędzy pierwszą, a drugą ramką, czy, drugą, a trzecią? MoŜna
odpowiedzieć, Ŝe wystarczyłoby umieścić te atrybuty w trzeciej ramce, ale w przypadku
KURS HTML
większej ilości ramek i chęci zmiany tych elementów dla środkowych ramek byłoby to albo
niemoŜliwe, albo na kaŜdej przeglądarce wyglądałoby inaczej. Te atrybuty wpisujemy do obu
ramek, pomiędzy którymi ma zniknąć moŜliwość przewijania i widoczność obramowania.
Uwaga: pamiętajmy, Ŝe w dokumencie, który przechowuje kod ramek moŜemy umieścić
sekcję HEAD, w które moŜemy umieścić niektóre niedługo poznane metatagi, a takŜe tytuł,
jednakŜe te wartości nie oznaczają tego, iŜ moŜemy sobie odpuścić je w dokumentach
wyświetlających się w ramkach.
Uwaga: pamiętajmy, Ŝe w dokumencie przechowującym ramki musimy nadać inną
specyfikację (znacznik <!DOCTYPE>, który zawsze powinien być przed znacznikiem
<HTML>). Zamiast kodu, który został umieszczony w drugiej lekcji uŜyjmy poniŜszego:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN">
Uwaga: jeŜeli chcemy zrobić ramki mieszane, czyli pionowe i poziome naraz, musimy w
jednym, lub w większej ilości dokumentów domyślnych dla ramek umieścić ponownie kod
ramek, z przeciwnym typem ich rozmieszczenia – dla COLS będzie to ROWS i na odwrót.
Zastosowanie ramek
Skończyliśmy juŜ opisywanie znacznika <FRAMESET> więc teraz zajmijmy się
alternatywą ramek. Całą sekcję BODY umieszczamy pomiędzy znacznikiem NOFRAMES
(ang. nie ramki). To co będzie zawierać sekcja BODY wyświetli się nam na ekranie, w
przypadku przeglądarki nie obsługującej ramek. Najlepiej umieścić tam informacje, Ŝe
"Twoja przeglądarka nie obsługuje ramek", albo najlepiej wszystkie linki do podstron
serwisu, dzięki czemu uŜytkownik i tak będzie mógł zobaczyć to, co oferuje serwis. PoniŜsze
przykłady prezentują dwa kody ramek – pierwszy dla ramek pionowych, a drugi dla ramek
poziomych:
<HTML>
<HEAD>
</HEAD>
<FRAMESET COLS="100,*">
<FRAME SCROLLING="auto" NAME="spis" SRC="spis.htm" NORESIZE
FRAMEBORDER="0">
<FRAME SCROLLING="yes" NAME="tresc" SRC="strona_glowna.htm"
NORESIZE FRAMEBORDER="0">
KURS HTML
</FRAMESET>
<NOFRAMES>
<BODY>
niestety twoja przeglądarka nie obsługuje ramek<br />
zapraszam na <A HREF="strona_glowna.htm">stronę główną</A></BODY>
</NOFRAMES>
</HTML>
<HTML>
<HEAD>
</HEAD>
<FRAMESET ROWS="100,*">
<FRAME SCROLLING="auto" NAME="spis" SRC="spis.htm" NORESIZE
FRAMEBORDER="0">
<FRAME SCROLLING="yes" NAME="tresc" SRC="strona_glowna.htm"
NORESIZE FRAMEBORDER="0">
</FRAMESET>
<NOFRAMES>
<BODY>
zapraszam na <A HREF="strona_glowna.htm">stronę główną</A></BODY>
</NOFRAMES>
</HTML>
Pływająca ramka czyli ramka wewnętrzna
Czas na ramki wewnętrzne. W tym przypadku nie musimy zmieniać Ŝadnego typu
dokumentu, ani Ŝadnych zbędnych elementów. Ramka wbudowana, to specjalny kod
umieszczony wewnątrz najzwyklejszego dokumentu HTML (obok treści, w tabelce,
gdziekolwiek chcemy), który po załadowaniu wyświetli nam załączony za pomocą
specjalnego atrybutu dokument. Znacznik ramki wewnętrznej to <IFRAME>.
Jej atrybuty, podobnie jak w ramkach standardowych to: NAME - nazwa ramki, SRC adres domyślnego dokumentu, SCROLLING - ustawienie pasków przewijania (te same
KURS HTML
wartości), FRAMEBORDER - ustawienie obramowania (te same wartości), ale i takŜe znane
nam juŜ atrybuty: WIDTH - długość ramki, HEIGHT - wysokość ramki i jeŜeli chcemy
ALIGN - oblanie tekstem, lub innymi elementami ramki.
<IFRAME> jest znacznikiem opcjonalnym, pomiędzy którym umieszczamy tekst, który
wyświetli się posiadaczom przeglądarek niezdolnym do wyświetlenia ramki. Przykładowy
kod ramki:
<IFRAME SCROLLING="auto" NAME="irama" SRC="irama.htm"
FRAMEBORDER="0" WIDTH="200" HEIGHT="200">
zapraszam <A HREF="irama.htm">tutaj</A>
</IFRAME>
Uwaga: JeŜeli chcemy zrobić link, który w ramkach standardowych nie otwiera się w
ramce, w której był link, tylko zastępuje cały dokument z ramkami w jego atrybucie
TARGET musimy umieścić wartość _top, a jeŜeli chcemy, aby otworzył się w innej ramce...
przeczytaj wcześniejsze "uwagi" z tej lekcji.

13. ramki - strona główna

Transkrypt

Podobne dokumenty

1. Ramki. Prosta animacja.

Kliknij aby pobrać dokument w formacie PDF

ODCINEK 2 RAMKA NA ZDJĘCIA

Scenariusz „RAMKA”

Ramka szklana

baby art ramka podwójna wstążka

Ramka na zdjęcie

ANALIZA SEMANTYCZNA OBRAZU I DŹWIĘKU (ASOD)