«Фреймдер құру тәсілдері»

Тақырып бойынша 11 материал табылды

«Фреймдер құру тәсілдері»

Материал туралы қысқаша түсінік

ұстаздарға

Материалдың қысқаша нұсқасы

ОҚО,Түркістан қаласы,№21 колледж

Информатика пәнінің оқытушысы

Кожахметов Нурлан Бегманович

Тақырыбы: «Фреймдер құру тәсілдері»

Жоспар:

І.Ұйымдастыру кезеңі:

ІІ.Үй тапсырмасын тексеру

Тақырыбы: «Кесте тұрғызу»

1.Кестелер тұрғызу

2.Кестелер тұрғызуға мысалдар келтіру

3.Тапсырма: Тәжірибелік жұмыс жасау

ІІІ.Жаңа сабақ. «Фреймдер құру тәсілдері»

Жоспар:

1.Фреймдер құру тегтері

2.<FRAME> тегі

IV.Бекіту.

1-тапсырма.Фреймдер бағдарламасын жасау.

V.Үй тапсырмасы

VI.Бағалау.

VII.Пайдаланылған әдебиеттер.

Сабақтың тақырыбы: Фреймдер құру тәсілдері

Сабақтың мақсаты: HTML-дегі фреймдер құру тəсілдері және оларды экранға шығару туралы тың мәліметтер беру.

Білімділік мақсаты : Оқушыларға HTML-де фреймдер құруды үйрету;
Дамытушылық мақсаты: Оқушылардың броузер терезесін фреймдерге бөлу үшін қолданылатын тегтермен таныстыру және қабілетін дамыту;
Тәрбиелік мақсаты: Оқушыларды фреймдер құру жүйесін пайдаланып есептердің мәндерін дұрыс шығаруға үйрете отырып, жан-жақты болуға, ұжымшылдыққа, ұқыптылыққа тәрбиелеу.

Сабақтың көрнекілігі: Интерактивтік тақта, слайд.

Сабақтың түрі: Тәжірибе

Сабақтың әдісі: түсіндіру, сұрақ-жауап, сын тұрғысынан ойлау.

Пән аралық байланыс: Информатика, желілік технологияға енгізу

Сабақтың барысы:

І. Ұйымдастыру кезеңі:

1. Оқушылармен сәлемдесу;

2. Аудитория тазалығына мән беру;

3. Оқушыларды түгелдеу;

4. Оқушылардың назарларын сабаққа аудару.

ІІ. Үй тапсырмасын тексеру.

Тақырыбы: Кесте тұрғызу

1.Кестелер тұрғызу

2.Кестелер тұрғызуға мысалдар келтіру

3-тапсырма. Тәжірибелік жұмыс жасау

HTML-де жыл мезгілдер кестесінің бағдарламасын құру

<html>

<head>

<title>кесте куру</title>

</head>

<body>

<caption>жыл мезгилдери</caption>

<th>Коктем</th>

<tr><td>Кыркуйек</td> <td>Желтоксан</td><td>Наурыз</td> <td>Маусым</td></tr>

<tr><td>Казан</td> <td>Кантар</td><td>Сауир</td><td>Шилде</td></tr>

<tr><td>Караша</td> <td>Акпан</td><td>Мамыр</td><td>Тамыз</td></tr>

</table>

</body>

</html>

4-тапсырма. Сұрақ- жауап

1. <TABLE> тегінің қызметі қандай? Кесте тұрғызу <TABLE> жəне </TABLE> тəгтері көмегімен орындалады

2. <TR> тегі қандай қызметі атқарады? Кестенің әрбір жолын анықтайды

3. <TD> жəне <ТН> тегтерінің жұмысы қандай? жолдардағы бағаналарды анықтайды

4. BGCOLOR параметрінің қызметі, ол қандай тегтерде қолданылады? Кесте торының ішкі фон түсін тағайындайды және <table bgcolor=> тегінде қолданылады.

5. WIDTH параметрінің қызметі, ол қандай тəгтерде қолданылады? Кесте енін анықтайтын бүтін сан, оның мəні пиксельмен немесе пайызбен (%) беріледі.

6. Кесте жолының ішкі фон түсін анықтау қалай атқарылады? BGCOLOR тегі арқылы атқарылады.

7. COLSPAN параметрінің қызметі, ол қандай тегтерде қолданылады? Бағаналар тақырыбына арналған жол (ұя) ішінде орналасатын бағаналар саны.

8. ALIGN мен VALIGN атрибуттарынң қызметі мен мəндері қандай? ALIGN атрибуты кесте тақырыбын шет жақтарға туралайды, оның мəні

LEFT, CENTER (көрсетілмесе, келісім бойынша осы мəн қабылданады), RIGHT сөздерінің біріне сəйкес келуі тиіс.

VALIGN атрибуты кесте тақырыбын вертикаль бағытта туралайды, ол ТОР,

MIDDLE, BOTTOM (келісім бойынша осы мəн қабылданады), BASELINE

сөздерінің бірін мəн ретінде қабылдай алады.

9. Кестенің жақтау сызықтарының қалыңдығын өзгерту қалай жүргізіледі? BORDERCOLOR тегі арқылы қалыңдығын өзгерте аламыз

10. Сырғымалы жолды жасау тегін атаңыз? MARQUEE> ...... </MARQUEE> тəгтері

ІІІ. Жаңа сабақ.

Фреймдер құру тегтері
<FRAME> тегі

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

Фреймдер құру үшін <FRAMESET> жəне <FRAME> тегтері қолданылады

да, мұнда əдеттегідей <BODY> тегі пайдаланылмайды. <FRAMESET> тегі

броузер терезесіндегі фреймдердің көлемдері мен олардың орналасу тəртібін

сипаттайды, <FRAME> тегінде фреймдердің əрқайсысына шақырылатын құжаттар аттары көрсетіледі. Енді екі фреймнен тұратын экран құрайтын бағдарлама бөлігіне мысал келтірейік:

1-мысал

<html>

<head>

<title>фреймдер кұру тәсілі</title>

</head>

</frameset>

</html>

<html>

<head>

</head>

</body>

</html>

<html>

<head>

</head>

</body>

</html>

Мұндағы екі фрейм жолдар (rows) бойынша көлденеңнен бірінің астына бірі

орналасады, олар экранды 50 %-дан бөліп алады. Үстіңгі фреймде "1.html" құжаты ашылады да, төменгісінде – "2.html" орналасады.

Осындай екі файлдар жұмысы бір папка ішінде болуы тиіс. Фреймде тек мəтіндерді емес, суреттерді де орналастыруға болады. <FRAMESET> тегінің ROWS=... (қатарлар) атрибуты терезені горизонталь – көлденең бағыт бойынша жолдарға бөледі де, COLS=... (бағаналар) атрибуты тіке – вертикаль бағыттағы бағана түріндегі фреймдерге бөледі. Егер осы атрибуттың екеуі де берілсе, терезеде тіке жəне көлденең төртбұрыштардан тұратын торларға бөлінеді. Осы атрибуттардың мəндері терезе бөліктерінің көлемдерін (биіктігін немесе енін) анықтайды. Əр бағанаға (жолға) арналған параметрлер пиксель өлшем бірлігі бойынша немесе пайыздармен (%) үтірлер арқылы бөлініп беріледі. Соңғы параметр ретінде қалған көлемді автоматты түрде толық алып тұратын (*) жұлдызша белгісін де пайдалануға болады. Осындай фрейм үшін барлық қалған бос кеңістік бөлініп беріледі.

<FRAME> тегінде фреймдерге шақырылатын құжаттарды анықтайтын SRC=... атрибуты болуы керек. Қалған атрибуттар фреймдер арасындағы бөлу сызықтары параметрлерін жəне оның басқа кейбір қасиеттерін реттеу мүмкіндігін береді.

2-мысалда экранды бір тік екі көлденең және 3-мысалда бір көлденең екі тігінінен орналасқан тең көлемді фреймдерге бөлу тегтері төмендегідей болып жазылады:

2-мысал

<html>

<head> <title>HTML-ги фреймдер</title>

</head>

<frame>

<frame>

</frameset>

</html>

3-мысал

<html>

<head> <title>HTML-ги фреймдер</title>

</head>

<frame>

<frame>

</frameset>

</html>

<FRAMESET> … </FRAMESET> тегтері

Фрейм жасау <FRAMESET> тегінен басталады. Мұнда <BODY> тегі қолда-

нылмайды. Бұл тегтер фреймдер орналасатын төртбұрышты контейнерлерді,

яғни мəлімет орналасатын екі жағында да ашылу жəне жабылу шекаралық

жақтаулары бар тегтерді анықтайды. Олардың пайдалануға болатын атрибут-

тарымен бірге жазылу синтаксисі:

<FRAMESET [COLS="col1,col2,col3,..."] [ROWS="row1,row2,row3, .„"]

[FRAMEBORDER="1 не 0"] [FRAMESPACING="integer"] > ⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅⋅

</FRAMESET>

<FRAMESET> тегінің мынадай атрибуттары бар.

COLS – фрейм бағаналарының пайызбен (%), пиксельмен немесе салыстырмалы бірлікте (*) берілген ендері. Мысалы, COLS= "25%, 100,*" үш

бағанадан тұратын фреймдерді анықтайды, біріншісінің ені – терезенің 25

пайызы, екіншісінің ені – 100 пиксель, ал үшіншісінің ені - броузер терезесінің қалған бөлігі. Жақтау сызықтарын анықтайтын үш атрибут бар, олар BORDER, FRAMEBORDER жəне BORDERCOLOR.

FRAMEBORDER – фрейм жақтауларын бөліп тұратын сызық сызады. Ол 1-

ге тең болса – дөңес сызық, 0 болса – жай сызық сызылады (мəні берілмесе,

келісім бойынша, 1 болып есептеледі).

FRAMESPACING – фреймдер арасындағы бос кеңістік мөлшерін пиксельмен беретін бүтін сан.

BORDER – барлық фреймдер жақтаулары сызығының қалыңдығын пиксельмен анықтайды. Мысалы: <FRAMESET BORDER="10"> . Егер оның мəні 0 болса, жақтау сызығы болмайды. Бұл атрибут көрсетілмесе, келісім бойынша, оның мəні 5 болып қабылданады. Фреймдердің ішкі бөліктері жақтаулары да FRAMEBORDER жəне FRAMESPACING атрибуттары мəнімен анықталады, яғни фрейм жасау кезінде бұларды сыртқы тегте бір рет көрсету жеткілікті.

BORDERCOLOR атрибутының мəні стандартты түс атауларына немесе түстің оналтылық жүйедегі RGB-мəндеріне сəйкес келеді.Мысалы: <FRAMESET BORDERCOLOR="red" ROWS="*,*">

ROWS – фрейм жолдарының пайызбен (%), пиксельмен немесе салыстыр-

малы бірлікте (*) берілген биіктігін анықтайды.

2.<FRAME> тегі жеке бір фрейм қасиеттерін анықтайды. Ол FRAMESET тегтерінің ішінде орналасатын жабылмайтын жалқы тег болып табылады.

<FRAME> тегінің фрейм қасиеттерін анықтайтын алты атрибуты бар: NAME, MARGINWIDTH, MARGINHEIGHT, SRC, NORESIZE жəне SCROLLING. Олардың қолданылу ережелері төмендегідей:

<FRAME SRC="URL" NAME="терезе_аты"

SCROLLING=yes|no|auto MARGINWIDTH="мəні"

MARGINHEIGHT="мəні" NORESIZE>

Барлық атрибуттарды пайдалану міндетті емес. Көбінесе тек SRC атрибуты

ғана пайдаланылады.

SRC= ... осы фреймде орналасатын гипермəтіндік құжат атын, яғни фреймде

көрсетілетін файлдың адресін анықтайды. Бұл файл əдетте FRAMESET тегі

жазылған бумада орналасқан кəдімгі HTML құжаты болады. Егер SRC атрибуты көрсетілмесе, фрейм бос тұрады.

MARGINWIDTH=n атрибуты фреймнің сол жəне оң жақтарындағы пиксель санымен берілген бос кеңістік мөлшерін анықтайды.

MARGINHEIGHT=n, фреймнің жоғары жəне төмен жақтарындағы пиксельмен берілген бос кеңістік мөлшерін анықтайды. Бұл екеуінің мəні əрқашанда абсолютті түрде пиксельмен беріледі. Мысалы: <FRAME MARGINHEIGHT="5" MARGINWIDTH="6"> кадрдың жоғары жəне төмен жағында 5 пиксельден, ал сол жəне оң жақтарында 6 пиксельден орын қалдырады. Əдетте бос кеңістік 1-ден 6-ға дейінгі мəндерді қабылдайды.

SCROLLING=... фрейм бойынша жылжу жолақтары. Егер жылжу жолағы

болуы керек болса – SCROLLING=YES , ал олар болмайтын болса – SCROLLING=NO, ал егер жолақтардың болуын/болмауын броузер анықтайтын жағдайда – SCROLLING= AUTO деп жазылады. Егер бұл атрибут көрсетілмесе де, келісім бойынша AUTO мəні қабылданады. Мысалы:

NORESIZE атрибуты фрейм көлемі тұрақты болып, оның өзгермейтінін көрсетеді. Мысалы: <FRAME NORESIZE>

BORDERCOLOR атрибуты <FRAMESET> жəне <FRAME> тегтерінің екеуінде де қолданыла береді. Оның мəні стандартты түс атауларына немесе

түстің оналтылық жүйедегі RGB-мəндеріне сəйкес келеді.

IV.Бекіту

1-тапсырма. Фреймдер бағдарламасын жасау. (кез келген сурет қоюға болады)

Тапсырманың html-дағы бағдарламасы

<HTML> <HEAD> <TITLE>1 freim </TITLE> </HEAD>

<BODY>

<marquee><H1> Кош келдиниздер</H1></marquee>

</BODY>

</HTML>

<HTML>

<HEAD> <TІTLE> ЕТБ-0913 окушылар тизими </TІTLE> </HEAD>

<H1 align = center> Окушылар тизими </H1>

<OL>

<LI> Абдуллаев Баймат;

<LI> Бейбит Асел;

<LI> Урестимов Максат;

<LI>

</OL>

</BODY>

</HTML>

<BODY>

<P> <IMG SRC="1.jpg"> Уйдин сурети.

</BODY>

</HTML>

<html>

<head> <title>HTML-ги фреймдер</title>

</head>

</frameset>

</html>

V . Үйге тапсырма: Фреймдер құру тәсілдері тақырыбын оқу және суретттің бағдарламасын құру

Бағалау.

Сабаққа белсенді қатысып, үй тапсырмасын орындап келген оқушыларды бағалап, нәтижесін естірту.

Пайдаланылған әдебиеттер.

1.Интернетке кіріспе «Бүкіл дүниежүзілік өрмек» әдістемелік құрал, Е.Балапанов, Б.Бөрібаев, Е.Абдильдин, Алматы-1999ж

2.В.Яворский, ӘСмағұлова, А.Әмірова «Компьютерлік желілер» Астана 2008

3.www.google.kz сайтарынан

Жүктеу

Бөлісу

ЖИ арқылы жасау

Файл форматы:

docx

Информатика Ашық сабақ Барлық сыныптар

06.06.2018

1712

Жүктеу

ЖИ арқылы жасау

Жариялаған:

Кожахметов Нурлан Бегманович

Бұл материалды қолданушы жариялаған. Ustaz Tilegi ақпаратты жеткізуші ғана болып табылады. Жарияланған материалдың мазмұны мен авторлық құқық толықтай автордың жауапкершілігінде. Егер материал авторлық құқықты бұзады немесе сайттан алынуы тиіс деп есептесеңіз,
шағым қалдыра аласыз

«Фреймдер құру тәсілдері»

«Фреймдер құру тәсілдері»

Химия пәні

Тарих пәні

Биология пәні

Ағылшын тілі пәні

География пәні

Информатика пәні

Мектепке дейінгі білім беру

«Қазақ тілі» жəне «Қазақ əдебиеті»

Дене шынықтыру

Білім алушылардың білім сапасын арттыру

Инклюзивті білім беру