Mam nadzieję, że znasz już podstawy html’a i wiesz jak zrobić prostą stronę. Ale na pewno chciałbyś stworzyć stronę ładniejszą i efektowniejszą, powiedzmy taką która posiada wygodniejszy interface i umożliwia lepszą nawigację.
Zastanawiałeś się kiedyś jak np. umieścić na stronie (w jednym oknie) kilka dokumentów (np. html) lub jak wykonać popularne ostatnio z jednej strony menu a z drugiej miejsce gdzie będą się wyświetlały inne dokumenty html? Jeżeli nie wiesz jak to zrobić to zapraszam do poniższego tutorialu w którym dowiesz się jak projektować i stosować ramki. Co to właściwie sź te ramki i na czym to wszystko polega… Ramki pozwalają podzielić stronę na kilka fragmentów. Każdy taki fragment nazywa się ramką (ang. frames). Każda ramka jest niezależna i może wyświetlać inny dokument. Powiedzmy jedna ramka służy jako spis (patrz wyżej) druga jako nagłówek a jeszcze inna odpowiada za wyświetlane teksty. Cała zabawa polega na tym aby dobrze zaprojektować ramki które razem będą tworzyły jedną spójną stronę.
Podstawy – przykład 1
Całą strukturę ramek opisujemy w pliku podstawowym. To właśnie w nim ustalamy, jak mają wyglądać ramki oraz, w jakiej ramce ma się wyświetlić, jaki dokument html. Zawiera on więc strukturę ramek. Reszta plików to dokumenty poboczne, które są zawartością ramek. Tak jak w zwyczajnym pliku html wszystko, co wyświetla się na stronie, umieszczamy między flagami;
| <BODY></BODY> |
tak w pliku podstawowym (opisującym ramki) są one zastąpione flagami
| <FRAMESET></FRAMESET> |
Mmiędzy nimi wpisujemy wszystkie parametry ramek. Wygląda to mniej więcej tak:
| <FRAMESET COLS=”20%,*%”> <FRAME SCROLLING=”auto” NAME=”lewa” SRC=”lewa.html”> <FRAME SCROLLING=”yes” NAME=”prawa” SRC=”prawa.html”> </FRAMESET> |
Flaga <FRAMESET COLS=”20%,*%”> otwiera strukturę ramek i w tym przypadku dzieli stronę na dwie kolumny (COLS). Pierwsza to 20% szerokości strony, a druga to reszta (* – to, co pozostało), czyli 80% :). Oczywiście jeżeli chcesz to możesz podzielić stronę na wiersze, używasz wtedy zamiast COLS parametru ROWS. Wielkości ramek możesz określać także przy pomocy pikseli. Zawartość ramek Gdy podzieliliśmy już naszą stronę, czas określić, w jakiej ramce, co będzie się znajdowało. Czyli przypisujemy odpowiednim ramkom źródła Używamy do tego celu flagi <FRAME>. Każda taka flaga odpowiada jednej ramce (komórce). Opisujemy je zawsze od lewej do prawej przy pomocy takich parametrów jak SCROLLING , NAME i SRC.
Scrolling
Przy pomocy SCROLLING określamy czy dana ramka ma posiadać pasek przewijania. Używamy go, gdy dokument w ramce jest za duży (za wysoki/ szeroki) i nie da się go całego umieścić. SCROLLING posiada trzy właściwości: YES, NO i AUTO. W przypadku AUTO, pasek jest wyświetlany tylko wtedy, gdy plik jest za duży. YES i NO chyba nie muszę tłumaczyć 😉
Name
Przechodzimy dalej. Dzięki NAME jak sama nazwa wskazuje nadajemy ramce nazwę, ułatwi nam to później pracę np. gdy będziemy chcieli aby link z jednej ramki prowadził do drugiej. W znakach „” możemy wpisać dowolną nazwę jaka przyjdzie nam do głowy.
Źródło
Najważniejszy parametr, którym ustalamy źródło ramki, jest SRC. Na pewno znacie już go z wcześniejszych lekcji. Jak się domyślacie w „” musicie wpisać nazwę pliku, który ma się wyświetlić w ramce. Jak widzisz nie ma w tym nic trudnego, wystarczy dobrze podzielić stronę, opisać każdą ramkę i wszystko powinno działać :). Oczywiście nie wszystkich zadowala strona z, powiedzmy, dwoma ramkami. Załóżmy, że ktoś chce wykonać stronę w większą ich ilością.
Schody
Trzy kolumny uzyskamy za pomocą COLS=”20%,30%,50%”, trzy wiersze to ROWS=”10,30,*”. Schody zaczynają się jeżeli komuś przyjdzie do głowy wykonać coś bardziej skomplikowanego np. najpierw podzielić stronę na wiersze potem jeszcze każdy wiersz na osobne kolumny i co wtedy? Zapraszam do kolejnych artykułów o ramkach.
Zapraszamy do .
