Зертханалық жұмысқа берілген тапсырмалар

1. Төмендегі мысалды теріп, нәтижесін қарап шығыңдар да, оған бірсыпыра өзгерістер енгізіңдер:

<TABLE ALIGN=CENTER BORDER=3 WIDTH="80%"

BGCOLOR=YELLOW BORDERCOLOR=BLUE>

<CAPTION> <H2> Кесте тақырыбы </H2></CAPTION>

<TR><TD> кестенің бірінші торы </TD> <TD> кестенің екінші торы </TD> </TR>

<TR><TD> кестенің бірінші торы </TD> <TD> кестенің екінші торы </TD></TR>

</TABLE>

а) 1-жолдың фонын ақшыл (<TR BGCOLOR=SILVER>), сұр түске түрлендіріңдер.

б) жақтаулар (бордюрді) қалыңдығын, ұялардағы мәтінді өзгертіңдер, т.с.с.

2) Келесі мысалды теріп, нәтижесін қарап шығыңдар да, оған бірсыпыра өзгерістер енгізіңдер:

<TABLE ALIGN="RIGHT" BORDER="3" BORDERCOLOR="Blue" WIDTH="80%">

<CAPTION ALIGN="RIGHT" > Тақырып кестенің оң жақ жоғарғы бұрышына шығады </CAPTION>

<TR> <ТН COLSPAN="3"> Бағана тақырыбы </TН> </TR>

<TR ALIGN="RIGHT" BGCOLOR="yellow">

<TH> 1 бағана </ТН> <ТН> 2 бағана </ТН> <ТН> 3 бағана </TН>

</TR>

<TR> <TD> 1 бағана мәліметтері </TD>

<TD> 2 бағана мәліметтері </TD>

<TD> 3 бағана мәліметтері </TD>

</TR>

</TABLE>

а) Екі жолға да тағы бір бағана қосыңдар;

б) Тағы екі жол қосыңдар;

в) Тордағы мәтін сөздерін, кесте жолының фонын, жеке ұялардың да ішкі фонын өзгертіңдер;

г) Тақырып түсін өзертіңдер, т.с.с.

д) Кесте алдында, тақырыптан соң және кесте соңында түрлі түсті көлденең сызықтар жүргізіңдер.

Зертханалық жұмысты орындау реті

1. Әдістемелік нұсқаулармен танысу.

2. Әр студент берілген мысалды пайдаланып өзіне берілген есептің (варианттің) нәтижесін алу керек.

3. Әр вариант үшін зертханалық дәптерді толтырып оқытушыға тапсыру.

4. Бақылау сұрақтарына жауап беру.

Бақылау сұрақтары:

1. Кестені қандай тег арқылы жасаймыз?

2. Суретті бейнелерді кестеге қоюға бола ма?

3. Кесте жасау тәгінің қандай атрибуттары бар, олардың мәндері неге тең бола алады?

4. Кесте баған қандай тег арқылы орнатамыз?

№ 4 Зертханалық жұмыс

Бір web-парақта бірнеше құжаттарды орналастыру. Фреймдер құру тәсілдері

Жұмыстың мақсаты:HTML-құжаттарында фреймдермен жұмыс істеуді үйрену.

Теориялық мағлұмат

HTML тілі броузер программасы терезелерін бірнеше бөліктерге бөлу мүмкіндігін береді және олардың әрқайсысында жеке web-құжаттар бейнеленеді. Осындай бөліктерді фрейм немесе кадр деп аталады. Мұнда әрбір фрейм экрандағы жеке тіктөртбұрышты аймақты алып тұрады. Әр фрейм ішінде бір-бірінен тәуелсіз құжат орналастыра аламыз.

Фреймдер құру тәсілдері. Фреймдер құру үшін <FRAMESET> және <FRAME> тәгтері қолданылады да, мұнда әдеттегідей <BODY> тәгі пайдаланылмайды. <FRAMESET> тәгі броузер тере­зесіндегі фреймдердің көлемдері мен олардың орналасу тәртібін сипаттайды, <FRAME> тәгінде фрейм­дердің әрқайсысына шақырылатын құжаттар аттары көрсетіледі. Екі фреймнен тұратын экран құрайтын программа бөлігінен мысал келтірейік:

<html> <frameset rows="50%,50%"> <frame src="1 файл.htm"> <frame src="2 файл.htm"> </frameset> </html>

<html> <frameset rows="50%,50%"> <frame src="dog.jpg"> <frame src="cat.jpg"> </frameset> </html>

Мұндағы екі фрейм жолдар (rows) бойынша көлденеңнен бірінің астына бірі орналасады, олар экранды 50 %-дан бөліп алады. Үстіңгі фреймде "1 файл.htm" құжаты ашылады да, төменгісінде – "2 файл.htm" орналасады (1 сурет). Осындай файлдар жұмыс бумасында болуы тиіс. Оң жақтағы программада фреймдерде сурет орналастыру мысалы көрсетілген. <FRAMESET> тәгінің ROWS=... (қатарлар) атрибуты терезені горизонталь – көлденең бағыт бойынша жолдарға бөледі де, COLS=... (бағаналар) атрибуты тіке – вертикаль бағыттағы бағана түріндегі фреймдерге бөледі. Егер осы атрибуттың екеуі де берілсе, терезеде тіке және көлденең төртбұрыштардан тұратын торларға бөлінеді.