Фреймдар

Автор работы: Пользователь скрыл имя, 20 Февраля 2013 в 09:54, реферат

Краткое описание

Арнайы тегтер көмегімен экранды көлденеңінен де, тігінен де бірнеше бөліктерге бөлуге болады. Бұндай бөліктер фреймдер деп аталады. әрбір фреймге басқа фреймдерден тәуелсіз жеке (бөлек) URL-адрестер жазып, жеке айналдыру сызықтарын алуға болады. Фреймдерді құрудың екі тәсілі бар- олардың екеуі де <frameset>…</frameset> тегтерін қолданады, бірақ оларды не <body> тегінің орнына, не <body> тегі бар кезінде <head> тегтерінің арасына орнату керек.

Вложенные файлы: 1 файл

Фреймдар мен формалар.docx

— 22.53 Кб (Скачать файл)

Фреймдар 

 

Арнайы тегтер көмегімен  экранды көлденеңінен де, тігінен  де бірнеше бөліктерге бөлуге болады. Бұндай бөліктер фреймдер деп аталады. әрбір фреймге басқа фреймдерден  тәуелсіз жеке (бөлек) URL-адрестер жазып, жеке айналдыру сызықтарын алуға  болады. Фреймдерді құрудың екі тәсілі бар- олардың екеуі де <frameset>…</frameset> тегтерін қолданады, бірақ оларды не <body> тегінің орнына, не <body> тегі бар кезінде  <head>  тегтерінің арасына орнату керек.

<frameset> тегінің  негізгі атрибуттары: rows=  және cols= . олар жеке фреймдегі көлденең қатар (rows) мен тік бағандардың (cols) өлшемдерін білдіреді. Пикселмен немесе процентпен өлшенеді. Мысалы 40% / 60% пропорциямен екі фреймге тігінен бөлу былай жүргізіледі: <frameset cols= “40%, 60%”>

Үш фреймге бөлу: <frameset cols= “26%,34%,*”> мұндағы *-үшінші тік фреймнің экранның қалған бөлігін  алатынын, яғни 40% білдіреді.

Экранды бөлу пропорциясын көрсеткеннен кейін, әрбір фреймге  жүктелетін құжаттардың URL –адресін беру қажет. Мысалы,

<frameset cols= “40%, 60%”>

<frame src= “Dame.jpg”>

<frame src= “http://duesseldorf.ru”>

</frameset>

Бұл жағдайда сол жақтағы фреймге компьютердегі Dame.jpg файлы, ал оң жақтағы фреймге интернеттегі сайт жүктеледі. Фреймнің ішіне фреймді, яғни экранды бір уақытта көлденеңінен де, тігінен де бөлуге болады. Мысалы:

<frameset cols= “60%, 40%”>

<frameset rows= “35%, 25%, *”>

<frame src= “http://www.azon.ru/context/detail/id/1454360/”>

<frame src= “http://www.zevel.ru/”>

<frame src= “http://dvor.de”>

</frameset>

<frameset rows= “35%, 65%”>

<frame src= “http://www.litera.usluga.info/public.php”>

<frame src= “http://www.suche.ru/ru/catalog/31/60/index.php”>

</frameset>

</frameset>

<frameset border= “”> атрибуты көмегімен фреймдерді бөліп тұратын жолақтың енін өзгертуге болады және <frameset bordercolor= “#”> атрибуты арқылы оның түсін береді.

Ені 20 пиксел болатын  жасыл түсті жолақты құру мысалы:

<frameset border= “20”  bordercolor= “#00FF00”>

Сонымен бірге әрбір  фреймге ат беруге болады:

<frame src= “index.htm”  name= “main”>

<frame src= “http://www.osan-koeln.net”  name= “slave”>

Фреймдерге ат қою бір фреймдегі құжатты екіншісіне жүктеуге, фреймдер арасында ақпарат алмасуға мүмкіндік береді. Бұл былай жазылады:

<a href= “http://www.kolesnik.ru/2005/blog/”  target= “slave”>  what is it “blog”?  </a> түріндегі жазуды main аты бар бірінші фреймге жүктелетін index.htm құжатына жазайық. target= “slave” нұсқауы гиперсілтеме бойынша тышқанмен түрткенде оның екінші фреймге жүктелуін қамтамасыз етеді. Фреймдерді құру кезінде басқа да атрибуттарды пайдалануға болады. Сол және оң бағандардың шамаларын реттеу <frame marginwidth= “ ”> , жоғарғы және төменгі қатарлардың шамаларын реттеу <frame marginheight= “ ”>  атрибуттары арқылы жүргізіледі.

<frameset cols= “40%,*”>

<frame src= “porzellan.jpg”><frame marginwidth= “150” marginheight= “300” src=“http://newskijprospekt.de”  name= “prauij”></frameset>

Сайтқа кірушілерден ақпарат алу: Форма құру, <form> тегінің атрибуттары. Форманың input, select, textarea элементтері

Айталық, сіз сайт немесе Web-бет құрдыңыз дейік. Енді өзіңіздің бетіңізге бірнеше адамдарды шақыру үшін олардың бет жөніндегі ойларын білгіңіз келеді немесе егер бет коммерциялық мақсатта құрылған болса, онда сіздің өнімдеріңіз бен қызметіңізге тапсырыстар қабылдағыңыз келеді. Мұндай қосымша ақпараттар сіз үшін өте маңызды.

Яғни әңгіме сайтты құрушы мен қолданушылардың арасындағы кері байланыс жөнінде болып отыр. Әрине, мұндай байланыс сайтқа сіздің электрондық почтаңыздың адресін орнату арқылы мүмкін болады. Қолданушы электрондық почтаны қолданған кезде автоматты түрде өзінің электрондық адресін де жібереді. Көптеген адамдарға бұл ұнамайды: жарнамалық хабарламалар ағынынан қорқады. Сондықтан форма деп аталатын арнайы құралды пайдаланған өте тиімді. HTML тілі жөнінде осыған дейін айтылғандар Web-құжаттардың сыртқы бейнелену тәсілдеріне-шрифттердің өлшемі мен түрі, артқы фон түсі, суреттерді орнату және т.с.с. арналған және бұл жерде ішкі немесе сыртқы гиперсілтемелерді есепке алмағанда қолданушының сервермен өзара байланысы белсенді емес. Гиперсілтемелерді қолданғанда клиенттің сервермен белсенді әрекеті жүреді – қолданушы – клиент өз қажеті бойынша гиперсілтемені құрады және Интернеттен қажет құжатты жүктейді, бір құжаттан келесісіне ауысады. Бірақ қолданушы мен сервер арасындағы интерактивті диалогтық  режимді ұйымдастыру тек формалар көмегімен ғана мүмкін болады.

Сыртқы формалар қарапайым стандартты элементтер жиынынан – батырмалар, әртүрлі түрдегі терезелер, ашылатын меню, т.б. тұрады. Мысалы 1-суретте батырмалар жиынынан тұратын форма көрсетілген.

 
   




 

  

 

 

  

 

 

  

 

 

  

 

1-cурет

1-сурет мысалынан көретініміздей, қолданушы өз жасына сай дөңгелекті  белгілеп,      сосын ОК батырмасы арқылы дауыс береді. Немесе төменге ашылатын меню           арқылы да қолданушы өз нұсқасын таңдайды. Мұндай бірінші топтағы формаларды қолданудың мақсаты қолданушыға алдын-ала берілген нұсқалардан таңдау мүмкіндігін беру. Қолданушы нүктелерді, белгішелерді қою арқылы немесе төменге ашылатын менюден қажет пунктті таңдау арқылы өз нұсқасын таңдағаннан кейін форма бұл ақпаратты серверге жібереді. Серверде клиент жіберген ақпарат  [айнымалы аты]=[айнымалы мәні] жұбы түрінде өңдеу программаларына беріледі. Айнымалы аты латын әріптерімен беріледі. Форма неден тұрады? Web-құжатта форма <FORM> тегімен ашылып, </FORM> тегімен жабылады. Құжатта бір уақытта бірнеше формалар құруға болады, бірақ олар бірінің ішінде бірі орналаспауы қажет. Форма ішінде HTML –мәтінді, белгілерді, тіпті кестені шексіз орнатуға болады. <FORM> тегі үш атрибутты қамтиды: ACTION, METHOD, ENCTYPE. ACTION атрибуты міндетті болып табылады. Ол форманы өңдейтін программа орналасқан сервердің адресін анықтайды. METHOD атрибуты формадағы берілгендер өңдеуші программаға қай әдіспен (гипермәтінді тасымалдау хаттамасы) жіберілетінін анықтайды. Мүмкін мәндері METHOD=POST-серверде құрылған мәліметтер қорына өзгерістер енгізеді. METHOD=GET – сервердегі мәліметтер қорын өзгертпейді. Егер бұл атрибуттың мәні қойылмаса, үнсіз келісім бойынша METHOD=GET қабылданады. ENCTYPE атрибуты формадағы берілгендердің өңдеуші-программаға берілуі үшін қалай кодталатынын білдіреді. Егер оның мәні қойылмаса, үнсіз келісім бойынша ENCTYPE=APPLICATION/X-WWW-FORMURLENCODED мәні таңдалынады.

Қарапайым форма мысалысервердегі өңдеуші-программаға формадан берілгендерді  тасымалдау үрдісін орындату (жүргізу) үшін қолданушы қандай да бір әрекетті орындау қажет. Web-құжатта оны  келесі оператордың көмегімен құрады:

<INPUT TYPE=Submit>

Web-құжаттың ішінде мұндай жолды  кездестіргенде браузер экранда  сәйкес жазуы бар батырма құрады. Бұл батырманы басқанда формадағы  барлық берілгендер өңдеуші-программаға  жөнелтіледі. Батырмадағы жазу VALUE=“жазу”  атрибуты арқылы беріледі. Мысалы: <INPUT TYPE=Submit  VALUE= “Алға”>

HTML-құжатта бұл бөлік былай  жазылады.

<FORM>

<INPUT TYPE=Submit  VALUE= “Алға”>

</FORM>

“Алға” батырмасын басқан кезде  батырмадағы жазуды сервердегі өңдеуші-программаға  жіберу үшін батырма анықтамасында  қосымша NAME=[аты] атрибутын енгізу қажет. Мысалы: <INPUT TYPE=Submit  NAME=button VALUE= “Алға”>

Бұндай батырмаға басқан кезде  өңдеуші программа мәні “Алға” болатын button айнымалысын алады.

Формада әртүрлі аттары және/немесе мәндері бар Submit типті бірнеше  батырма болуы мүмкін. Бұл жағдайда өңдеуші программа қолданушы  қандай Submit батырмасын басқанына сәйкес әрекет жасауы қажет.

Бұл үшін әрбір батырмаға өзіндік  айнымалы аты сәйкестендірілуі қажет:  button1, button2, button3.

<FORM>

<INPUT TYPE=Submit  NAME=button1 VALUE= “Алға қарай”>

<INPUT TYPE=Submit  NAME=button2 VALUE= “Кейінге қарай”>

<INPUT TYPE=Submit  NAME=button3 VALUE= “Тоқта”>

</FORM>

Форма берілгендерді қалай жинайды? Басқа типті <INPUT> элементтері  де бар. Әрбір <INPUT> элементі NAME=[аты]  атрибутын қамту қамтуы қажет. Ол элемент атын анықтайды және өңдеуші программаға берілетін сәйкес айнымалы аты болуы керек. Аты тек латын әріптерімен берілуі қажет және үнсіз келісім бойынша 20 символдан аспауы қажет. Көптеген <INPUT> элементтері VALUE= “Мәні” атрибутын қамтиды. Бұл атрибут өңдеуші программаға берілетін осы аттың мәнін анықтайды.

<INPUT TYPE=Text> және <INPUT TYPE=Password> элементтері  үшін бұл атрибут міндетті  емес, себебі сәйкес айнымалы  мәнін қолданушы пернетақтадан  енгізе алады.

Элементтердің негізгі типтері

<INPUT>: TYPE=Text

Бұл элемент  мәтін жолдарын енгізетін терезені анықтайды және мынадай қосымша атрибуттарға ие бола алады:

Size=[сан] – енгізу терезесінің  ұзындығы, символмен;

Maxlength=[сан] – енгізілетін жолдың  максималды мүмкін ұзындығы, символмен.

Мысалы <INPUT TYPE= Text  Size=20 NAME=User VALUE= “Олег”>

Бұл жазу мәтінді енгізу үшін ұзындығы 20 символ болатын терезені анықтайды. Үнсіз келісім бойынша терезеде “Олег” мәтіні тұрады, қолданушы мәтінді  өзгерте алады.

Терезедегі мәтінді өзгертуге  болады, сосын өзгертілген немесе өзгертілмеген мәтінді User айнымалысы көмегімен өңдеуші программаға  жіберуге болады.

TYPE=Password парольді енгізу терезесін  анықтайды. Бұл Text типті элементке  өте ұқсас, бірақ енгізілген  символдардың орнына экранда  жұлдызша (*) немесе қара дөңгелекше (    )

көрсетіледі.

Мысал: <FORM>

<INPUT TYPE= Password  NAME=pass Size=20 Maxlength=10>

</FORM>

парольді енгізу үшін ұзындығы 20 символдық  терезені анықтайды. Парольдің максималды мүмкін ұзындығы 10 символ. Енгізілген пароль өңдеуші программаға pass айнымалысы арқылы жіберіледі.

“Радиобатырма” элементі Type=radio.

Бұл элемент радиобатырма деп аталатын батырманы анықтайды. Батырманың бұрын  белгіленгенін  көрсететін checked қосымша атрибутын қамтуы мүмкін. Бірдей атқа ие радиобатырмалар тобында тек бір ғана радиобатырма белгілене алады.

Мысал. Қолданушы сыйымдылығы 4,7 немесе 9,6 ГБайт DVD  дискіні таңдайды:

<FORM>

<INPUT TYPE= Radio NAME=DVD  Value= “4,7 ГБайт” checked> 4,7 ГБайт  <br>

<INPUT TYPE= Radio NAME=DVD  Value= “9,6 ГБайт”> 9,6 ГБайт

</FORM>

Мұндай құрылым 4,7 және 9,6 ГБайт  деп жазылған екі радиобатырмалар  тобын анықтайды.Бастапқыда бірінші  батырма белгіленген. Егер қолданушы  басқа батырманы белгілемесе, онда үнсіз келісім бойынша өңдеуші  программаға 4,7 Гбайт мәні бар DVD айнымалысы беріледі. Егер қолданушы басқа батырманы  белгілесе, онда өңдеуші программаға  мәні 9,6 Гбайт болатын DVD айнымалысы жіберіледі. 

 

 


DVD-рекордер 

 

 


USB-стик 

 

 


DSL-модем 

 

 


Сыртқы флоппи-диск енгізгіш 

 

Checkbox элементі

Type=checkbox  ішіне белгі салуға болатын квадратты анықтайды. Квадраттың белгіленгендігін білдіретін checked атрибуты болады. Радиобатырмадан айырмашылығы аттары бірдей квадраттар тобында бір уақытта бірнеше квадраттарды белгілеуге болады.

<FORM>

<INPUT TYPE= Checkbox  NAME=comp  Value= “DVD”> DVD-рекордер  <br>

<INPUT TYPE= Checkbox  NAME=comp  Value= “USB” checked > USB-стик  <br>

<INPUT TYPE= Checkbox  NAME=comp  Value= “DSL”> DSL-модем  <br>

<INPUT TYPE= Checkbox  NAME=comp  Value= “Floppy” checked> Сыртқы флоппи-диск енгізгіш

</FORM>

Бұл құжат 4 квадраттан тұратын топты анықтайды. Бастапқыда екінші және төртінші квадраттар белгіленген. Егер қолданушы өзгертпесе, өңдеуші программаға comp=USB және comp=Floppy айнымалылары жіберіледі.


Информация о работе Фреймдар