Pobieranie prezentacji. Proszę czekać

Pobieranie prezentacji. Proszę czekać

HTML. RAMKI Ramka to zdefiniowana część okna przeglądarki, której to części przypisano właściwości takie jak całemu oknu. Ramka to zdefiniowana część

Podobne prezentacje


Prezentacja na temat: "HTML. RAMKI Ramka to zdefiniowana część okna przeglądarki, której to części przypisano właściwości takie jak całemu oknu. Ramka to zdefiniowana część"— Zapis prezentacji:

1 HTML

2 RAMKI Ramka to zdefiniowana część okna przeglądarki, której to części przypisano właściwości takie jak całemu oknu. Ramka to zdefiniowana część okna przeglądarki, której to części przypisano właściwości takie jak całemu oknu. ramka może być przewijana niezależnie od pozostałej zawartości okna. ramka może być przewijana niezależnie od pozostałej zawartości okna. Można swobodnie zmieniać jej rozmiary. Można swobodnie zmieniać jej rozmiary. Zawartość ramki tworzy standardowy plik HTML Zawartość ramki tworzy standardowy plik HTML

3 RAMKI Wszystkie cechy ramek określane są za pomocą atrybutów znacznika Wszystkie cechy ramek określane są za pomocą atrybutów znacznika Układ ramek to zestaw ramek wypełniający okno przeglądarki lub ramkę w zewnętrznym układzie ramek Układ ramek to zestaw ramek wypełniający okno przeglądarki lub ramkę w zewnętrznym układzie ramek Poszczególne ramki układu mogą mieć swoje nazwy – można tworzyć połączenia do ramek oraz stosować nazwy ramek w skryptach. Poszczególne ramki układu mogą mieć swoje nazwy – można tworzyć połączenia do ramek oraz stosować nazwy ramek w skryptach. prezentacja informacji w układzie ramek jest charakterystyczna dla aplikacji komputerowych. prezentacja informacji w układzie ramek jest charakterystyczna dla aplikacji komputerowych.

4 RAMKI znacznik znacznik Układ ramek jest definiowany w pliku HTML, w którym element body zastąpiono elementem frameset. Układ ramek jest definiowany w pliku HTML, w którym element body zastąpiono elementem frameset. W elemencie tym określane są następujące cechy układu ramek: W elemencie tym określane są następujące cechy układu ramek: Sposób podziału okna na ramki.Sposób podziału okna na ramki. Liczba wierszy lub kolumn.Liczba wierszy lub kolumn. Obszar ekranu przyporządkowany poszczególnym kolumnom/wierszom.Obszar ekranu przyporządkowany poszczególnym kolumnom/wierszom.

5 Ogólna postać definicji układu ramek Ogólna postać definicji układu ramek Tytuł strony Tytuł strony...

6 Układ ramek Aby zdefiniować układ ramek, konieczne jest: Określenie liczby ramek w układzie Określenie liczby ramek w układzie Przygotowanie plików, które wypełnią poszczególne ramki. Jeśli na przykład w układzie będą trzy ramki, konieczne będą trzy pliki HTML Przygotowanie plików, które wypełnią poszczególne ramki. Jeśli na przykład w układzie będą trzy ramki, konieczne będą trzy pliki HTML

7 Układ ramek - schemat Plik definiujący układ ramek bazuje na plikach definiujących zawartość poszczególnych ramek

8 Podział okna przeglądarki na pionowe ramki Znacznik przyjmuje dwa atrybuty: cols i rows. Cols: umożliwia określenie liczby kolumn, na które zostanie podzielone okno przeglądarki (liczby ramek pionowych). umożliwia określenie liczby kolumn, na które zostanie podzielone okno przeglądarki (liczby ramek pionowych). atrybut ten pozwala także wskazać sposób przypisania kolumnom obszaru okna. atrybut ten pozwala także wskazać sposób przypisania kolumnom obszaru okna.

9 Podział okna przeglądarki na ramki Liczba kolumn określana jest liczbą wartości atrybutu cols. Liczba kolumn określana jest liczbą wartości atrybutu cols. Wartości te podawane są kolejno, z przecinkami. Wartości te podawane są kolejno, z przecinkami. Wartości – czyli szerokość ramki – można definiować w pikselach, w procentach (względem całkowitej szerokości układu ramek) oraz za pomocą znaku * (w tym przypadku przydzielana jest ramce maksymalna możliwa szerokość). Wartości – czyli szerokość ramki – można definiować w pikselach, w procentach (względem całkowitej szerokości układu ramek) oraz za pomocą znaku * (w tym przypadku przydzielana jest ramce maksymalna możliwa szerokość).

10 Podział okna na ramki o jednakowej szerokości atrybutowi cols należy przypisać wartości określone za pomocą symbolu *. atrybutowi cols należy przypisać wartości określone za pomocą symbolu *. Jeśli układ ramek ma składać się z trzech identycznych ramek, definicja elementu frameset będzie następująca: Jeśli układ ramek ma składać się z trzech identycznych ramek, definicja elementu frameset będzie następująca: UWAGA. Powinno się unikać definiowania rozmiarów ramek w jednostkach bezwzględnych, a jeśli już, to wymiary pozostałych ramek należy określić za pomocą gwiazdki, *, aby pozostała część ekranu została wypełniona. Powinno się unikać definiowania rozmiarów ramek w jednostkach bezwzględnych, a jeśli już, to wymiary pozostałych ramek należy określić za pomocą gwiazdki, *, aby pozostała część ekranu została wypełniona.

11 Układ trzech ramek pionowych Układ trzech ramek pionowych Układ trzech ramek pionowych

12 Układ trzech ramek pionowych

13 Układ ramek pionowych - przykład Strona z układem 2 ramek: ramka nawigacyjna (z lewej) i ramka do prezentacji tematu Zdefiniujmy odpowiednie pliki: uklad_ramek.html – układ dwóch pionowych ramek. uklad_ramek.html – układ dwóch pionowych ramek. nawigacja.html – plik zawierać będzie listę, której elementami będą połączenia. nawigacja.html – plik zawierać będzie listę, której elementami będą połączenia. strona.html – plik html drugiej ramki. Zostanie on załadowany do drugiej ramki po wczytaniu układu ramek do okna przeglądarki. strona.html – plik html drugiej ramki. Zostanie on załadowany do drugiej ramki po wczytaniu układu ramek do okna przeglądarki. pliki pozostałych dokumentów html – ich liczba będzie zależała od tego, ile połączeń zdefiniujesz w ramce nawigacyjnej, pliki pozostałych dokumentów html – ich liczba będzie zależała od tego, ile połączeń zdefiniujesz w ramce nawigacyjnej,

14 uklad_ramek.html Ramki w pionie Ramki w pionie

15 nawigacja.html Nawigacja Wybierz interesujący cię temat: Wybierz interesujący cię temat:

    strona 1 strona 1 strona 2 strona 2 strona 3 strona 3

16 nawigacja.html Elementami listy są połączenia prowadzące do kolejnych plików html: strona 2 strona 2 Połączenia są definiowane za pomocą znacznika, który przyjmuje dwa atrybuty: href i target. Wartością atrybutu src są adresy url plików wyświetlanych w szerszej z ramek. Ramka ta jest wskazywana jako cel połączeń za pomocą atrybutu target – jego wartością jest nazwa szerszej ramki. Atrybut target ma kluczowe znaczenie w definiowaniu systemu nawigacji między ramkami.

17 strona.html Strona To jest plik o nazwie strona.html. To jest plik o nazwie strona.html. Jeśli chcesz wyświetlić inny plik, kliknij połączenie... Jeśli chcesz wyświetlić inny plik, kliknij połączenie...

18 strona.html

19 Formatowanie ramek Blokowanie przewijanie zawartości ramki Usuwanie obramowań:

20 Formatowanie ramek

21 Podział okna w poziomie Przykład: Ramki poziome Ramki poziome

22 baner.html Banner Oto najwspanialsza strona WWW na świecie!!! Oto najwspanialsza strona WWW na świecie!!!

23 strona.html Strona Strona To jest ramka, w której wyświetlana będzie strona To jest ramka, w której wyświetlana będzie strona

24 Strona z podziałem poziomym

25 Układ mieszany

26 Mieszany układ ramek Mieszany układ ramek

27 Układ mieszany ramek

28 Zabezpieczenie przed nieprawidłową obsługą ramek (element noframes) element noframes umieszcza się w obrębie elementu frameset: Tytuł strony Tytuł strony Przeglądarka nie obsługuje ramek! Przeglądarka nie obsługuje ramek!

29 Definiowanie ramki lokalnej (element iframe) Ramka lokalna definiowana jest przy pomocy pary znaczników. Ramka lokalna definiowana jest przy pomocy pary znaczników. Atrybuty tego elementu to: name, width, height, src i align. Znacznik umożliwia tworzenie ramek w dowolnym miejscu dokumentu HTML. Znacznik umożliwia tworzenie ramek w dowolnym miejscu dokumentu HTML.

30 Definiowanie ramki lokalnej (element iframe) – atrybut name pozwala nadać ramce nazwę. Umożliwia to tworzenie celów i połączeń. – atrybut name pozwala nadać ramce nazwę. Umożliwia to tworzenie celów i połączeń. – atrybut width pozwala definiować szerokość ramki (w pikselach lub w procentach szerokości okna przeglądarki). – atrybut width pozwala definiować szerokość ramki (w pikselach lub w procentach szerokości okna przeglądarki). Przykładowa postać kodu: – atrybut height pozwala definiować wysokość ramki (w pikselach lub w procentach szerokości okna przeglądarki). Przykładowy kod to: – atrybut height pozwala definiować wysokość ramki (w pikselach lub w procentach szerokości okna przeglądarki). Przykładowy kod to:

31 Definiowanie ramki lokalnej (element iframe) – atrybut src jest stosowany do zdefiniowania źródła dokumentu HTML umieszczanego w ramce. Oto przykład definicji: – atrybut src jest stosowany do zdefiniowania źródła dokumentu HTML umieszczanego w ramce. Oto przykład definicji: – atrybut align umożliwia zdefiniowanie sposobu wyrównania względem linii tekstu, w której ramka się pojawia. Możliwe wartości to: left, middle, right, top i bottom (wartość domyślna). – atrybut align umożliwia zdefiniowanie sposobu wyrównania względem linii tekstu, w której ramka się pojawia. Możliwe wartości to: left, middle, right, top i bottom (wartość domyślna).

32 Podstawowe atrybuty znacznika Podstawowe atrybuty znacznika NAZWAOPIS longdesc=url Połączenie do strony zawierającej obszerny opis ramki. Stosuj tam, gdzie spodziewasz się, że ramki nie będą obsługiwane. marginheight=piksele Wysokość marginesu. marginwidthpiksele Szerokość marginesu. frameborder=0|1 Określa, czy obramowanie ramki ma być wyświetlane. noresize=true|false Określa, czy użytkownik ma możliwość zmiany rozmiarów ramki. scrolling=yes|no|auto Definiuje sposób przewijania ramki. name=nazwa_ramki Nazwa ramki. src=url Podaje ulokowanie pliku, który zostanie wyświetlony w ramce.

33 Nazwy specjalne ramek NAZWAOPIS _blankOtwiera stronę w nowym oknie. _selfOtwiera stronę w bieżącej ramce lub oknie. Jest to ustawienie domyślne. Korzysta się z tej nazwy, aby zniwelować działanie ustawienia w znaczniku (czyli wyświetlenie dokumentu w ramce domyślnej, wskazanej przez ten znacznik). _topPowoduje, że ładowany dokument jest wyświetlany w oknie umieszczonym na wierzchu stosu i zajmuje całe okno, zastępując układ ramek. Umożliwia to ucieczkę ze środowiska ramek. _parentDokument jest ładowany do ramki nadrzędnej względem ramki zawierającej bieżący dokument.


Pobierz ppt "HTML. RAMKI Ramka to zdefiniowana część okna przeglądarki, której to części przypisano właściwości takie jak całemu oknu. Ramka to zdefiniowana część"

Podobne prezentacje


Reklamy Google