HTML

Форми - Frameset

Форми - Frameset
(0 от 0 гласували)

 Форми - Frameset

 

Може да имаме следното разделяне на екрана: отляво документ с меню от връзки и отдясно да се показват съответните на връзките документи. Частите на екрана, на които се разделя се наричат карета (frames). Подреждането на екрана изглежда почти аналогично на подреждането, което би се получило чрез таблици. Предимството на каретата е, че могат да се използват различни файлове.
За да опишем какво искаме, ни е необходим още един файл, който показва на броузера как точно да става това разделяне и как да се появяват на екрана съответните документи.

Създаването на карета става чрез маркерите:
<FRAMESET> </FRAMESET>
Те се пишат вместо <BODY> и </BODY>.

За да опишем колко на брой реда ни трябват, се използва опцията ROWS:
<FRAMESET ROWS="x,y,z...">   </FRAMESET>
x,y,z,... се задават в брой пиксели или в % от екрана или като * - частта от екрана, която остане е за този ред.

За да опишем колоните за всеки ред използваме опцията COLS:
<FRAMESET COLS= "x,y,z..."> </FRAMESET>

Можем да зададем ширина на рамка около каретата чрез опцията BORDER, чийто стойности са в брой пиксели.
<FRAMESET BORDER=x>

Задаване на име на файл, който ще се появи в съответното каре става чрез маркера:
<FRAME SRC="URI">
Този маркер е единичен (няма съответен затварящ), появява се толкова пъти, колкото файла искаме да имаме на екрана и се пише между <FRAMESET> и </FRAMESET>.

Всяко каре може да си има собствено име, което се задава чрез опцията NAME:
<FRAME SRC="URI" NAME="име">
По подразбиране резултата от щракване върху връзките във всяко каре се появява в същото каре. Ако има посочено име на каре, чрез допълнителна опция TARGET в маркера за връзка <A HREF="URI"> това име може да се използва за резултата от щракването да се появи в именуваното каре.

Чрез допълнителните опции SCROLLING (със стойности yes, no, или auto) и  NORESIZE могат да се задават съответно дали да има или не ивиците за прелистване (scrollbars) и изрично да не се променя размера на карето.
Съществуват и други опции, като цвят на рамката около карето, за които можете да прочетете във web site на Netscape http://developer.netscape.com.

Тъй като има все още броузери, които не разпознават маркерите за карета, можете да опишете текст, който да се появи тогава между маркерите:
<NOFRAMES> </NOFRAMES>

Пример 1:

Да създадем файл frames.html, който да описва следното разделяне на екрана на карета:

Файл frames.html за описание на разделянето изглежда така:

<HTML>
<HEAD>
<TITLE>Карета - WWW Страница на училище "Кирил и Методий"
</TITLE>
</HEAD>
<FRAMESET COLS="40%, *">
      <FRAME SRC="school.html" name="left">
      <FRAME SRC="history.html" name="right">
</FRAMESET>
<NOFRAMES> Необходима ви е по-нова версия на броузера, която да показва карета.
</NOFRAMES>
</HTML>

Файл school.html е модифициран по следния начин:

<HTML>
<HEAD>
<TITLE>WWW Страница на училище "Кирил и Методий"
</TITLE>
</HEAD>
<BODY BGCOLOR="#FFFFE0" LINK="#007700" VLINK="#00FF00" ALINK="#FF0000">
<H1 ALIGN=CENTER>Училище "Кирил и Методий" </H1>
<UL>
<LI><A HREF="history.html" TARGET="right">История на училището</A></LI>
<LI><A HREF="teachers.html"  TARGET="right"> Преподаватели</A></LI>
<LI><A HREF="priem.html" TARGET="right"> Приемни изпити</A></LI>
<LI>
<A HREF= "mailto:cyrilmeth@schools.bg">Пишете ни до електронния адрес на училището
<IMG SRC="mail.gif" BORDER=0>
</A>
</LI>
<LI>
<A HREF="http://www.vazov.schools.bg"  TARGET="_blank"> Училище "Иван Вазов"</A>
</LI>
</UL>
</BODY>
</HTML>

Файл priem.html е модифициран по следния начин:

<HTML> 
<HEAD> 
<TITLE>Приемни изпити в училище "Кирил и Методий" 
</TITLE> 
</HEAD> 
<BODY BGCOLOR="#FFFFFF"> 
<TABLE ALIGN=CENTER BORDER=2> 
<CAPTION ALIGN=TOP>Дати за приемни изпити 
</CAPTION> 
<TR BGCOLOR="#009900"> 
   <TH>Дата</TH> 
   <TH>Изпит</TH> 
</TR> 
<TR> 
   <TD>17 юни </TD> 
   <TD>математика</TD> 
</TR> 
<TR> 
   <TD>22 юни </TD> 
   <TD>български език </TD> 
</TR> 
<TR> 
   <TD>26 юни</TD> 
   <TD>история</TD> 
</TR> 
</TABLE> 
</BODY> 
</HTML> 

И файл history.html

<HTML> 
<HEAD> 
<TITLE>История на училище "Кирил и Методий" 
</TITLE> 
</HEAD> 
<BODY BGCOLOR="beige"> 
<H2 ALIGN=CENTER>История на училище "Кирил и Методий" </H2> 
<P> 
<FONT SIZE=+2 COLOR="red">У</FONT>чилището е създадено през 1901г. ... 
</P> 
<P> 
<FONT SIZE=+2 COLOR="red">Е</FONT>дин от възпитаниците му е ... 
</P> 
</BODY> 
</HTML>
 

Ето какъв ще бъде резултата при щракване на връзката "Приемни изпити"

Форми - Frameset

Коментари