Студопедия

КАТЕГОРИИ:


Архитектура-(3434)Астрономия-(809)Биология-(7483)Биотехнологии-(1457)Военное дело-(14632)Высокие технологии-(1363)География-(913)Геология-(1438)Государство-(451)Демография-(1065)Дом-(47672)Журналистика и СМИ-(912)Изобретательство-(14524)Иностранные языки-(4268)Информатика-(17799)Искусство-(1338)История-(13644)Компьютеры-(11121)Косметика-(55)Кулинария-(373)Культура-(8427)Лингвистика-(374)Литература-(1642)Маркетинг-(23702)Математика-(16968)Машиностроение-(1700)Медицина-(12668)Менеджмент-(24684)Механика-(15423)Науковедение-(506)Образование-(11852)Охрана труда-(3308)Педагогика-(5571)Полиграфия-(1312)Политика-(7869)Право-(5454)Приборостроение-(1369)Программирование-(2801)Производство-(97182)Промышленность-(8706)Психология-(18388)Религия-(3217)Связь-(10668)Сельское хозяйство-(299)Социология-(6455)Спорт-(42831)Строительство-(4793)Торговля-(5050)Транспорт-(2929)Туризм-(1568)Физика-(3942)Философия-(17015)Финансы-(26596)Химия-(22929)Экология-(12095)Экономика-(9961)Электроника-(8441)Электротехника-(4623)Энергетика-(12629)Юриспруденция-(1492)Ядерная техника-(1748)

Жат ішіне тізімдер орналастыру 1 страница




HTML тілі мәтін абзацтарының сыртқы пішімін толық анықтауға мүмкін­дік береді. Абзац элементтерін үлкейтуге, кішірейтуге, қалың­да­тып немесе қисайтып, астын сызып жазуға, тізім түрінде белгілеуге болады. Енді тізім­дер жасайтын мүмкіндіктердің бырсыпырасын қарастырайық. Жалпы тізім элементтері арнайы тәгтермен қоршалып, экранға шығарылғанда олардың сол жақтарында тізім белгілері орналасады.

4.1. Нөмірленбеген тізімдер

<UL> және </UL> (unordered list – реттелмеген тізім) тәгтері ара­сында орналасқан мәтіндер нөмірленбей, бірақ белгіленіп жазылған тізімдер ретінде қарастырылады. Мұнда тізімнің әрбір жаңа элементін <LI> (list – тізім) белгісінен бастап жазу қажет. Мысалы, экранда жасыл түсті әріптермен терілген мынадай тізім жасау үшін:

· Сәуле;

· Мақсат;

· Данияр;

· Ержан

төмендегідей түрде HTML тілі мәтінін Блокнотта теріп, Internet Explorer-де 4-1 мысалды көріп шығу керек:

<HTML> <HEAD> <TІTLE> 4-1 мысал </TІTLE> </HEAD>

<BODY text= green>

<H2 ALIGN = CENTER> Белгіленген тізім жолдары </H2> <HR>

<UL>

<LI> Сәуле;

<LI> Мақсат;

<LI> Данияр;

<LI> Ержан

</UL>

<HR>

</BODY>

</HTML>

<LI> белгісі үшін жабылу тәгінің қажет емес екенін байқаған боларсыздар.

<UL> тәгінің атрибуты type = disc | circle | square

олар белгі маркерінің сыртқы пішінін өзгертіп, сәйкесінше дөңгелек | шеңбер | квадрат бейнесінде көрсете алады.

4.2. <OL> тәгі арқылы жазылатын нөмірленген тізімдер

Нөмірленген тізімдер алдыңғы белгіленген тізім тәрізді шығары­лады, олар тек <ОL> және </ОL> (ordered list – реттелген тізім) тәгте­рімен қоршалады да, нәтижесінде тізім нөмірі ретінде бүтін сандар жазылады. Жоғарыда келтіріл­ген мысалды аздап түрлендіріп, төмен­дегі 4-2 мысалда оларды нөмірлеп жазып шығайық:

<HTML> <HEAD> <TІTLE> 4-2 мысал </TІTLE> </HEAD>

<BODY text= green>

<H2 ALIGN = CENTER> Нөмірленген тізім жолдары </H2> <HR>

<ОL>

<LI> Сәуле;

<LI> Мақсат;

<LI> Данияр;

<LI> Ержан

</ОL>

<HR>

</BODY>

</HTML>

Бұл HTML тәгтері жұмысы нәтижесінде мынадай тізім шығарылады:

Нөмірленген тізім жолдары 1. Сәуле; 2. Мақсат; 3. Данияр; 4. Ержан

<UL> тәгінің екі атрибуты бар, олар:

start = нөмір

type = 1 | A | a | I | i

бұлардың алғашқысы нөмірлеуді біріншіден емес, көрсетілген кез келген нөмірден бастайды, ал екіншісі тізімді нөмірлеу жүйесін төмендегі кестедегідей түрде анықтайды.

6 кесте

Type атрибуты мәніне қарай тізімдерді нөмірлеу түрлері

type мәні стилі тізім нөмірленуі
  Араб цифрлары (келісім бойынша) 1, 2, 3, 4,...
A Латын алфавитінің бас әріптері A, B, C, D, …
a Латын алфавитінің кіші әріптері a, b, c, d, …
I Рим цифрлары (жоғарғы регистр) I, II, III, IV, …
i Рим цифрлары (төменгі регистр) i, ii, iii, iv,…

4.3. <DL> тәгі арқылы жазылатын анықтау тізімдері

Анықтау тізімдері <DL> (definition list) тәгі арқылы жазылады да, алдыңғы­лардан аздап өзгешелеу болып ке­леді. Мұнда <LI> тәгі орнына <DT> (definition term – анықталатын термин) және <DD> (definition definition – анықтаманың анықтамасы) белгілері жазылады. Осы­лар­ды 4-3 мысал ретінде қарастырып, программа мәтінінен үзінді келтірейік:

<HTML> <HEAD> <TІTLE> 4-3 мысал </TІTLE> </HEAD>

<BODY text= green> <H3 ALIGN = CENTER>

Анықтау тізімдері </H3>

<DL>

<DT>HTML

<DD> HTML (HyperText Markup Language) термині – “гипермәтіндік белгілеу тілі” деген сөз. Оның алғашқы нұсқасын Европадағы элементар бөліктер физикасы лабораториясының қызметкері Тим Бернерс-Ли жасап шығарған болатын.

<DT>HTML құжаты

<DD> Тіркелу аты *.htm (Unix жүйелеріндегі файлдарда

*.html) болып келген мәтіндік файл.

</DL> </BODY> </HTML>

Осы программа жұмысы нәтижесінде экранға мынадай мәлімет шығады:

HTML

HTML (HyperText Markup Language) термині – “гипермәтіндік белгілеу тілі” деген сөз. Оның алғашқы нұсқасын Европадағы элементар бөліктер физикасы лаборато­рия­сының қызметкері Тим Бернерс-Ли жасап шығарған болатын.

HTML құжаты

Тіркелу аты *.htm (Unix жүйелеріндегі файлдарда *.html)

болып келген мәтіндік файл.

<LI> тәгі сияқты <DT> және <DD> тәгтерінің жабылмай, жалғыз жазыла­ты­нына назар салыңыздар.

Егер терминдер анықтамасы қысқаша түсіндірі­летін болса, онда <DL COMPACT> белгісін пайдалануға болады. Енді төмендегідей 4-4 мысалды программа үзіндісі түрінде қарастырайық:

<HTML> <HEAD> <TІTLE> 4-4 мысал </TІTLE> </HEAD>

<BODY text= green> <HR> <H3 АLIGN=CENTER>

Қысқаша анықтамалар </H3>

<DL COMPACT>

<DT>АБАЙ

<DD> XIX ғасырдағы қазақ ақыны, әрі ағартушысы

<DT> ҚҰРМАНҒАЗЫ

<DD> XIX ғасырдағы қазақ сазгері, атақты күйші

<DT> МАХАМБЕТ

<DD>XVIII ғасырдағы қазақ ақыны, әрі батыры – жыр

семсері

</DL>

</BODY>

</HTML>

Бұл программа экранға мынадай мәтін шығарады:

АБАЙ XIX ғасырдағы қазақ ақыны, әрі ағартушысы

ҚҰРМАНҒАЗЫ XIX ғасырдағы қазақ сазгері, атақты күйші

МАХАМБЕТ XVIII ғасырдағы қазақ ақыны, әрі батыры –

жыр семсері

4.4. Қабатталған тізімдер

Кез келген тізімдегі элемент ішіне басқа да тізім түрлері енгі­зі­ліп, қабаттасқан тізімдер құрастырылуы да мүмкін. Бірақ мұндай қабатталған тізімдерді жиі қолдансақ, ол мәтінді экранға көпсатылы түрде шығарып, оның ұзындығын арттырып жібереді. Сондықтан оларды тек керек кезінде ғана қолдан­ған дұрыс деп саналады.

Қабатталып орналасқан тізімдерді мәтін мазмұндары мен әр түрлі жоспарлар дайындауда қолданған тиімді болып табылады. Осындай тізімдер ұйымдастыруды қысқаша мынадай 4-5 мысал­мен көрсетейік:

<HTML> <HEAD> <TІTLE> 4-5 мысал </TІTLE> </HEAD>

<BODY>

<H1 ALIGN=center> HTML бірнеше тізім түрлерін ұйымдастыра

алады </H1>

<DL>
<DT> Нөмірленбеген тізімдер

<DD> Нөмірленбеген тізім элементтері сол жақтан арнайы таңбамен белгіленіп, мәтін аздап оңға таман жылжып орналасады:

<UL>
<LІ> 1 элемент
<LІ> 2 элемент
<LІ> 3 элемент
</UL>
<DT> Нөмірленген тізім жолдары

<DD> Нөмірленген тізім элементтері сол жақтан нөмірлер арқылы

белгіленіп орналасады:

<OL>

<LІ> 1 элемент
<LІ> 2 элемент
<LІ> 3 элемент
</OL>
<DT> Анықтау тізімдері
<DD> Мұндай тізімдер алдыңғы екеуінен күрделірек, бірақ

оқуға ыңғайлы болады.

<P> Тізімдерді бірінің ішіне бірін жазып қабаттастыруға болады,

бірақ мүлде көп деңгейлер жасап, бұл тәсілмен тым

әуестеніп кету қажет емес екені есте болсын.

<P > Тізімдегі бір элемент ішінде бірнеше абзацтар тұруы мүмкін.

Ондай абзацтар сол жақ шеттен бірдей қашықтыққа ығысып

орналасады. </P>

</DL>

</BODY>

</HTML>

Осы программа нәтижесі:

HTML бірнеше тізім түрлерін ұйымдастыра алады Нөмірленбеген тізімдер Нөмірленбеген тізім элементтері сол жақтан арнайы таңбамен белгіленіп, мәтін аздап оңға таман жылжып орналасады: · 1 элемент · 2 элемент · 3 элемент Нөмірленген тізім жолдары Нөмірленген тізім элементтері сол жақтан нөмірлер арқылы белгіленіп орналасады: 1. 1 элемент 2. 2 элемент 3. 3 элеменn Анықтау тізімдері Мұндай тізімдер алдыңғы екеуінен күрделірек, бірақ оқуға ыңғайлы болады. Тізімдерді бірінің ішіне бірін жазып қабаттастыруға болады, бірақ мүлде көп деңгейлер жасап, бұл тәсілмен тым әуестеніп кету қажет емес екені есте болсын. Тізімдегі бір элемент ішінде бірнеше абзацтар тұруы мүмкін. Ондай абзацтар сол жақ шеттен бірдей қашықтыққа ығысып орналасады.

Тапсырмалар:

1. Осы бөлімдегі 4-2 мысалды теріп алып, оның нәтижесін Internet Explorer-де қарап әр қатарға өз топтарыңдағы студенттер аттарын енгізу керек.

3. Осы бөлімдегі 4-3 мысалды алып, нәтижесін қарап, әр қатарға өз топтарыңдағы студенттер фамилиясын тізіп жазып, онан кейін қалың­дық­тары және түстері әр түрлі болып келген, ұзындықтары да өзгермелі көлденең сызықтар жүргізу қажет.

4. Жоғарыда келтірілген 4-3 мысалды алып, нәтижесін көріп, қосымша жолдар енгізіп, инженер, дәрігер, бухгалтер мамандықта­рына түсінік беріңіздер.

5. Қысқаша анықтама беретін 4-5 мысалды алып, нәтижесін көріп, әр жолға топ оқушыларының аттарын жазып және оларға “оқу озаты”, “дарынды бала”, “көрікті бойжеткен” сияқты қысқаша анықтамалар беріп, қосымша мінездемелер жазу қажет.

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

1. Нөмірленбеген тізім тәгтері дегеніміз не?

2. Нөмірленетін тізім тәгтері қандай? Олардың атрибуттары ше?

3. Нөмірді 5 санынан бастау үшін не істеу керек?

4. Нөмірлерді a), b), c), … деген түрде жасауға бола ма? Болса, қалай?

5. Анықтау тізімдері қалай құрылады? Олар қысқаша құрыла ала ма?

6. Қабатталған тізімдер қалай құрылады?


5. КЕСТЕЛЕР ТҰРҒЫЗУ

Кесте тұрғызу <TABLE> және </TABLE> тәгтері көмегімен орындалады, оның әрбір жолын анықтау – <TR> және </TR> тәгтері арқылы, ал сол жолдардағы бағаналар – <TD> және </TD> немесе <ТН> және </ТН> тәгтері арқылы анықталады. <TD> және <ТН> тәгтерінің жұмысы ұқсас, бірақ <ТН> тәгтерімен қоршалған мәтін қарайтылған бағана тақырыптары болып табылады да, <TD> тәгтерімен одан кейінгі қарапайым бағаналар жазылады.

Кесте тақырыбы <CAPTION> және </CAPTION> тәгтерімен қоршалып жазылады. Жалпы кестені толық анықтау ережесі төмендегі үлгімен беріледі:

<TABLE ALIGN="center" BGCOLOR="#rrggbb" BORDER="integer"

BORDERCOLOR="#rrggbb" WIDTH="integer">......

</TABLE>

Бірақ кесте тұрғызу кезінде олардың кейбірі қолданылмауы да мүмкін. Енді осы кесте тәгі атрибуттарының атқаратын жұмысына тоқталайық:

ALIGN атрибуты кестенің шет жақтарға туралануын анықтайды (көрсе­тілмесе, келісім бойынша сол жақ шетке). ALIGN мәні – қостырнақша ішіндегі сөз – мына сөздердің біріне сәйкес келуі тиіс: LEFT (сол жақ шетке), CENTER (ортаға), RIGHT (оң жақ шетке).

BGCOLOR кесте торының ішкі фон түсін тағайындайды (он алтылық RGB форматындағы сан немесе ағылшын тіліндегі белгілен­ген түс атауы).

BORDER — бүтін сан, кесте жақтаулары сызығының пиксельмен берілген қалыңдығы. Егер BORDER берілмесе, жақтау сызықтары көрсетілмейді.

BORDERCOLOR жақтау сызықтарының түсін тағайындайды (он алтылық RGB форматындағы сан немесе ағылшын тіліндегі белгілен­ген түс атауы), BORDER атрибутымен бірге қолданылады.

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

Кесте тақырыбы <CAPTION> тәгімен төмендегі ережеге сәйкес беріледі:

<CAPTION ALIGN="top">...... </CAPTION>

Мұндағы атрибуттардың атқаратын қызметі мынадай болады.

ALIGN атрибуты кесте тақырыбын шет жақтарға туралау кезінде оның мәні LEFT, CENTER (көрсе­тілмесе, келісім бойынша осы мән қабылданады), RIGHT сөздерінің біріне сәйкес келуі тиіс. Ал егер ол тақырыпты вертикаль бағытта кестенің жоғарғы және төменгі жақтарына орналастыруы қажет болса, онда BOTTOM – жоғарыда (келісім бойынша осы мән қабылда­нады), ТОР – төменде сөздерінің бірін мән ретінде қабылдай алады.

Кесте жолы <TR> және </TR> тәгтерімен қоршалып тұрады, бұлардың алғашқысының мынадай бірсыпыра атрибуттары болуы мүмкін:

<TR ALIGN="center" BGCOLOR="#rrggbb" BORDERCOLOR="#rrggbb"> Кесте жолы… </TR>

Енді <TR> тәгінің осы атрибуттарына тоқталайық.

ALIGN — жол шеттерін туралау. Оның мүмкін мәндері LEFT (келісім бойынша), CENTER, RIGHT.

BGCOLOR жолдың ішкі фон түсін анықтайды (он алтылық RGB форматындағы сан немесе ағылшын тіліндегі белгіленген түс атауы).

BORDERCOLOR — жол жақтауларының түсі (он алтылық RGB форматындағы сан немесе ағылшын тіліндегі белгіленген түс атауы). Бұл атрибут <TABLE> тәгінің BORDER атрибутының мәні нөлге тең болмағанда ғана қолданылады.

ROWSPAN — бірнеше жолдарды біріктіріп, бір-ақ жол етіп жазу кезінде берілетін біріктірілетін жолдар саны.

Кесте жолындағы бағаналар (ұялар) <TD>... </TD> және <ТН>... </ТН> тәгтерімен төмендегі ережеге сәйкес анықталады:

<TD немесе ТН ALIGN="right" BACKGROUND="url" [BGCOLOR="#rrggbb" BORDERCOLOR="#rrggbb"] >

Бағана… </TD немесе /TН>

<TD> және <ТН> тәгтерінің атрибуттары қызметтері:

ALIGN — мәтінді горизонталь бағытта туралау атрибуты. Оның мүмкін мәндері: LEFT, CENTER (келісім бойынша), RIGHT.

BGCOLOR – фон түсін анықтау атрибуты (он алтылық RGB форматындағы сан немесе ағылшын тіліндегі белгіленген түс атауы).

BORDERCOLOR – ұя жақтауларының түсі атрибуты (он алты­лық RGB форматындағы сан немесе ағылшын тіліндегі түс атауы). Бұл атрибут <TABLE> тәгінің BORDER атрибутының мәні нөлге тең бол­ма­ғанда ғана қолданылады.

COLSPAN — бағаналар тақырыбына арналған біріктірілген жол (ұя) ішінде орналасатын бағаналар саны.

Бір студенттер тобы жайлы кесте құрып, мысал келтірейік.

<html> <body text=blue> <table border=10 bordercolor=green

width=100% align=center bgcolor=”yellow”>

<caption align=bottom> <H2>Студенттер жайлы мәліметтер </H2>

</caption>

<tr> <th colspan=4> ГНГ-03-1К тобы студенттерінің тізімі </th> </tr>

<tr> <th>&nbsp; </th> <th>Аты-жөні </th> <th> Адресі </th>

<th> Телефоны </th> </tr>

<tr> <th rowspan=3>Ұлдар </th> <td> Қалауов Ғазиз</td> <td>

Сәтпаев көшесі, 10-үй 6 пәтер </td> <td> 47-60-57 </td> </tr>

<tr><td>Мұқанов Қуаныш</td><td>Абай даңғылы,15-үй 25-пәтер</td>

<td> 36-99-61 </td> </tr>

<tr><td>Төреғалиев Данияр</td><td>Т.Өзал көшесі, 101-үй 6-пәтер</td>

<td> 77-77-77 </td> </tr>

<tr> <th rowspan=3>Қыздар</th>

<td>Жапсарбаева Сандуғаш</td><td> Т.Өзал көшесі, 101-үй 25-пәтер

</td> <td> 75-45-25 </td> </tr>

<tr> <td> Мәмедова Ділфуза</td><td> Т.Өзал көшесі, 101-үй 21-пәтер

</td> <td> 40-45-25 </td> </tr>

<tr> <td> Төлебаева Жаңыл</td><td> Т.Өзал көшесі, 101-үй 20-пәтер

</td> <td> 40-45-25 </td> </tr>

</table>

</body>

</html>

3 сурет

Енді тапсырмалар қарастырамыз.

Тапсырмалар:

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> <TH COLSPAN="3"> Бағана тақырыбы </TН> </TR>

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

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

</TR>

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

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

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

</TR>

</TABLE>

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

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

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

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

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

 


6. БІР WEB-ПАРАҚТА ФРЕЙМДЕР АРҚЫЛЫ БІРНЕШЕ ҚҰЖАТТАРДЫ ОРНАЛАСТЫРУ

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

6.1. Фреймдер құру тәсілдері

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

<html>

<frameset rows="50%,50%">

<frame src="1 файл.htm">

<frame src="2 файл.htm">

</frameset>

</html>

4 сурет

Мұндағы екі фрейм жолдар (rows) бойынша көлденеңнен бірінің астына бірі орналасады, олар экранды 50 %-дан бөліп алады. Үстіңгі фреймде "1 файл.htm" құжаты ашылады да, төменгісінде – "2 файл.htm" орналасады (4 сурет).

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

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

Экранды үш тік орналасқан тең көлемді фреймдерге бөлу тәгтері төмендегідей болып жазылады:

<frameset cols="33%,33%,* ">

<frame src="1 бағана файлы.htm">

<frame src="2 бағана файлы.htm">

<frame src="3 бағана файлы.htm">

</frameset>

5 сурет

Осы тәгтер жұмысы нәтижесі 5 суретте көрсетілген. Енді бес тордан – алғашқы бағанасы биіктіктері бірдей екі жолдан, ал екінші бағанасы – бірдей үш жолдан тұратын фреймдер тұрғызатын програм­ма бөлігін келтірейік.

<frameset cols="50%,50%">

<frameset rows="50%,* "> <frame src="1 тор.htm"> <frame src="2 тор.htm">

</frameset>

<frameset rows="33%,33%,* "> <frame src="3 тор.htm"> <frame src="4 тор.htm">

<frame src="5 тор.htm">

</frameset>

</frameset>

Бұл программаның нәтижесі төменде көрсетілген.

6 сурет

Әрбір фрейм көлемі, яғни ұзындығы немесе ені абсолютті түрде пиксельмен, экран мөлшерінің пайызымен немесе салыстырмалы i* (i – бүтін сан) түрінде беріледі. Егер екі-үш мән көрсетіліп, олар әр түрлі бірліктерде берілсе, броузер алдымен абсолюттік пиксель түріндегі мәнді тағайындайды, сонан соң қалғандарын пропорциональ түрде алады. * белгісі 1* деген белгімен парапар. Экранды фреймдерге бөлу солдан оңға және жоғарыдан төмен қарай жүргізіледі.

Экранды үш тік орналасқан фреймдерге бөлейік: екіншісінің ені 250 пиксель (мөлшері берілген сурет еніне тең), біріншісі – қалған көлемнің 25%-ын, ал үшіншісі – 75%-ын алатындай ету үшін мынадай атрибуттар мәнін жазу керек

<FRAMESET cols = ”1*,250,3*”>
××××××××××××××××××××××××××××××

</FRAMESET>

Келесі мысалда 2х3 мөлшерлі төртбұрыштар жиынынан тұратын фреймдар жасалады.




Поделиться с друзьями:


Дата добавления: 2014-12-10; Просмотров: 1772; Нарушение авторских прав?; Мы поможем в написании вашей работы!


Нам важно ваше мнение! Был ли полезен опубликованный материал? Да | Нет



studopedia.su - Студопедия (2013 - 2024) год. Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав! Последнее добавление




Генерация страницы за: 0.137 сек.