docR A M K I – cóż to takiego ?
download 
Reklamacja Transkrypt
R A M K I – cóż to takiego ?
R A M K I – cóż to takiego ? WAŻNE! Kilka lat temu niemal każdy dokument publikowany w Internecie zawierał ramki. Ramki są czymś więcej niż tylko pewnym rozwiązaniem przejściowym, większość pełnionych przez nie funkcji można realizować za pomocą znacznie bardziej elastycznych i efektywnych metod formatowania CSS. Ramki nadal są stosowane. Zostały objęte oficjalnymi definicjami typu dokumentu (DTD), w których wymienia się ich specjalne znaczniki i inne charakterystyczne elementy. RAMKI Ramki gwarantują przede wszystkim powoływanie niezależnych przewijanych obszarów dokumentu (przykładowo dokumentu HTMLowego), występujących w jednym oknie przeglądarki. Koncepcja ta wykorzystywana jest również w innych aplikacjach niezwiązanych w żaden sposób z przeglądarkami internetowymi. Rozwiązania np. w systemie operacyjnym np. Eksplorator plików systemu Windows. 1 Zbiór ramek Znacznik FRAMESET Znacznik <framset> wyznacza sposób rozmieszczenia ramek w dokumencie. Krótko mówiąc element definiuje zbiór ramek. Wykorzystuje się go zamiast elementu BODY w stronach z ramkami. Znacznik ten określa czy okno przeglądarki powinno zostać podzielone na wiersze, czy na kolumny, a także jakie powinny być ich rozmiary. Składnia: <framset cols|rows = ”rozmiary_kolumn_lub_wierszy”> WAŻNE W kodzie nie występuje znacznik <body>. Zamiast niego znacznikiem kontenera niższego rzędu w odniesieniu do <html> jest znacznik <framset> Znacznik <frame> zagnieżdżony w bloku <framset> definiuje zawartość ramek oraz określają różne właściwości samych ramek. Poza sekcjami <framset> i <head> w dokumencie nie występują inne bloku kodu. Znacznik FRAME Znacznik <framset> jest odpowiedzialny za wyznaczenie rozmieszczenia ramek na całej stronie, natomiast znacznik <frame> z kolei określa parametry danej ramki. Ogólnie rzecz ujmując znacznik ten definiuje źródło i właściwości ramek. Składnia: <frame name=”nazwa ramki” src=”adres_URL_treści”></frame> Atrybut name służy do przypisania ramce niepowtarzalnej nazwy, która będzie uwzględniona w skryptach i innych elementach zarządzających jej zawartości. Kolejny parametr tj. src określna adres URL dokumentu, który powinien wypełnić naszą ramkę. 2 PRZYKŁAD: <!doctype html public "-//w3c//dtd html 4.01 Framset//en" “http://www.w3.org/TR/html4/framset.dtd”> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>Tytuł strony www</title> </head> <frameset cols="33%,33%,33%"> <frame src="ramka01.html" scrolling=yes name="lewa"> <frame src="ramka02.html" scrolling=yes name="srodkowa"> <frame src="ramka03.html" scrolling=yes name="prawa"> <noframes> Twoja przeglądarka nie obsługuje ramek! </noframes> </frameset> </html> Ramki pływające Ramki pływające są elementami, które pozwalają na efektowniejsze umieszczenie niewielkich dokumentów w kontenerze wyposażonym w paski przewijania I osadzonym na stronie nadrzędnej. Choć zastosowanie klasycznych znaczników <framset> również umożliwia tworzenie poszczególnych obszarów przewijania treści, uzyskanie takiego rozkładu obszarów może być dość trudne ze względu na możliwość wyznaczenia jedynie wierszy i kolumn. Należy także pamiętać! Ramki pływające nie są w pełni obsługiwane przez wszystkie przeglądarki internetowe. Decydując się na wykorzystanie ramek pływających, trzeba pamiętać, że podobnie jak w przypadku stosowania pozostałych konstrukcji ramkowych, dokumenty musza zawierać definicje DTD właściwe dla zestawów ramek 3 Znacznik IFRAME Element definiuje ramkę zawierającą inną stronę WWW. Ramka może być umieszczona w dowolnej części dokumentu HTML. PRZYKŁAD: <center> <iframe src="podstrony/strona01.html" width="400" height="200" frameborder="1"> Twoja przeglądarka nie obsługuje ramek. </iframe> </center> W przykładzie powyżej podane są następujące atrybuty dla znacznika <iframe>: • src - określa adres dokumentu który zostanie załadowany do ramki; • width - określa szerokość ramki w pikselach; • height - określa wysokość ramki w pikselach; Dodatkowo wewnątrz znacznika umieszczony jest tekst który pojawi się na stronie w przypadku gdy przeglądarka nie obsługuje ramek pływających (tu warto poza standardowym tekstem dodać np. link do dokumentu w przypadku gdy u użytkownika nie pojawi się ramka). Ramki pływające są traktowane jako obiekty "inline", czyli są wyświetlane "w linii", w odróżnieniu od elementów blokowych. PRZYKŁAD: tekst tekst tekst … <iframe src="ramka_iframe.html" width="400" height="300"> Twoja przeglądarka nie obsługuje ramek pływających! </iframe> tekst tekst tekst… Ramki pływające domyślnie posiadają obramowanie. Aby je zlikwidować, ustaw atrybut frameborder na 0: PRZYKŁAD: <iframe src="ramka_iframe.html" width="400" height="300" frameborder="0"> Twoja przeglądarka nie obsługuje ramek pływających!</iframe> 4 Podobnie jak w przypadku zwykłych ramek, można kontrolować czy paski przewijania mają się pojawić lub nie. Służy do tego atrybut scrolling. Można do niego przypisać następujące wartości: auto - wartość domyślna. Paski przewijania pojawią się tylko wtedy gdy to będzie konieczne; yes - paski przewijania zawsze będą widoczne (jeżeli zawartość ramki nie będzie wymagała przewijania, pasek przewijania będzie nieaktywny); no - paski przewijania nie będą wyświetlane. Jeżeli zawartość ramki będzie wymagała przewinięcia, jedynym sposobem dostania się do treści poniżej jest przyciśnięcie lewego przycisku myszy w ramce i przeciągnięcie w dół, lub użycie kółeczka na myszce (ale te sposoby nie zawsze działają - w Firefox'ie nie działa żaden z nich, w IE działa tylko przeciąganie. W Operze i Netscape Browser'ze działają obydwa). PRZYKŁAD: <iframe src="ramka_iframe.html" width="400" height="300" scrolling="no"> Twoja przeglądarka nie obsługuje ramek pływających! </iframe> Przykład dodania mapy na stronę www: <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://mapy.google.pl/maps?f=q&source=s_q&hl=pl&geocode=&q=wro c%C5%82aw&sll=52.025459,19.204102&sspn=6.233751,14.128418&ie=UTF8& amp;hq=&hnear=Wroc%C5%82aw,+Dolno%C5%9Bl%C4%85skie&z=10&ll=51. 107885,17.038538&output=embed"></iframe><br /><small><a href="http://mapy.google.pl/maps?f=q&source=embed&hl=pl&geocode=&q =wroc%C5%82aw&sll=52.025459,19.204102&sspn=6.233751,14.128418&ie=U TF8&hq=&hnear=Wroc%C5%82aw,+Dolno%C5%9Bl%C4%85skie&z=10&l l=51.107885,17.038538" style="color:#0000FF;text-align:left">Wyświetl większą mapę</a></small> Źródło kodu: http://mapy.google.pl/ 5 6
