REFERAT KURS JUMISI / lab3
.docx3 – Laboratoriya jumisi
Grafika, siltemeler ha’m dizimler tiykarinda HTMLde a’piwayi bet jaratiw.
Ju’mistin’ orinlaniw tartibi:
Teoriyaliq bo’lim: Grafika, siltemeler ha’m dizimler haqqinda magliwmat beriw.
A’meliy bo’lim: Grafika, siltemeler, dizimlerden paydalanip veb-bet jaratiw.
Dizim - marker yamasa nomer menen baslanǵan bir- birine baylanısqan sóz yamasa gápler kompleksi bolıp tabıladı. Dizim hár qıylı maǵlıwmatlardı shólkemlestiriw hám sistemalastırıw múmkinshiligin beredi hám olardı paydalanıwshılarǵa qolay tárzde usınıs etedi.
Dizim to’mendegi tegler menen belgilenedi:
<ul>...< / ul> markirovkalang’an dizimdi dúziw;
<ol>...< / ol> cifrlı dizimdi dúziw;
<li>...< / li> dizimniń hár bir elementin ramkalaw.
Dizimler ishki bolıwı múmkin. Ishki bólekdegi dizimlerde birinshi dárejeli marker - dongelek, ekinshisi - sheńber, úshinshisi - kvadrat.
Belgilengen hám nomerlengen dizimlerge qosımsha túrde, hár bir element juplıqtan ibarat tariypler dizimi keltirilgen: termin hám tariyp.Belgiler dizimin jaratıw ushın tegler:
<dl>...< / dl> ramka tariypi dizimi;
<dt>... </ dt> ramkalaw termini;
<dd>... </ dd> ramka tariypi.
Siltemeler gipertekstli hújjetlerdiń tiykari bolıp, bir veb -betten basqasına, sonıń menen birge, veb -betdegi belgili bir jayǵa kóshiwge mumkinshilik beredi. Olardıń ayriqshalıǵı sonda, siltemenin’ ózi HTML-fayllarǵa emes, bálki hár qanday túrdegi faylǵa da alıp keliwi múmkin jáne bul fayl pútkilley basqa saytǵa jaylastırılıwı múmkin. Ahmiyetlisi, jalǵanıw ornatılatug’in faylga bariw mumkinshiligi boliwi.
Jup teg <a>…< / a> silteme sıpatında isleytuǵın súwretti yamasa tekstti óz ishine aladı.
<a href="http://vsetaksi.ru/rostov-na-donu/22.htm">Лидер</a>
Tekstke súwret qosıw ushın súwret faylınıń adresin kórsetetuǵın src atributi menen bir <img> teginen paydalanıladi. Súwret adressi silteme adressi menen birdey tárzde ornatıladı. Mısalı:
<img src="image.gif" alt="gif formatindag’i suwret">
<img src="jpeg/image.jpg" alt=" jpeg formatindag’i suwret ">
<img src="/image/image.png" alt="png formatindag’i suwret ">
Maslenin’ qoyiliwi:Aling’an bilimlerden paydalanip HTML gipertekstli tili jardeminde vep-bet jaratiw.
Maslenin’ sheshiliwi:
Daslep index.html fayilin jaratip og’an HTML kodlardi jazamiz:
<!DOCTYPE html>
<html>
<head>
<title> Gu'ller dunyasi </title>
</head>
<body bgcolor="yellow">
<table width="100%" height = "100px">
<tr>
<td>
<p align="center"><font face="Calibri Light" size="60px" color="white">Gu'ller dunyasi</font></p>
</td>
</tr>
</table>
<table bgcolor="white" width="100%" border = "1px" cellpadding="5" cellspacing="0">
<tr align="center">
<td width="25%">
<a href = "#">Magazin</a>
</td>
<td width="25%">
<a href = "#">Firma</a>
</td>
<td width="25%">
<a href = "#">Forum</a>
</td>
<td width="25%">
<a href = "#">Sayt haqqinda</a>
</td>
</tr>
</table>
<table width="100%">
<tr>
<td height="40px">
</td>
</tr>
<tr>
<td width="25%" align="center" bgcolor="white">
<ul>
<li><a href="">Tan'lang'anlar</a></li><br>
<li><a href="">Janaliqlar</a></li><br>
<li><a href="">Qosimsha mag'liwmat</a></li><br>
<li><a href="">Biz benen baylanisiw</a></li><br>
</ul>
<fieldset>
<legend>Gu'ller</legend>
<a href="#"><label>Roza</label></a><br><br>
<a href="#"><label>Lala</label></a><br><br>
<a href="#"><label>Romashka</label></a><br><br>
<a href="#"><label>Tyulpan</label></a><br><br>
<a href="#"><label>Gvazdika</label></a><br><br>
<a href="#"><label>Fikus</label></a><br><br>
</fieldset>
</td>
<td align="center">
<a href="">
<img src="images/11.jpg" width="78%">
<p></p>
</a>
</td>
</tr>
</table>
<table width="100%">
<tr>
<td width="25%" bgcolor="white" align="center"><a href="#"><img src="images/n1.jpg"><p>Buket №1</p></a>
</td>
<td width="25%" bgcolor="white" align="center"><a href="#"><img src="images/n2.jpg"><p>Buket №1</p></a>
</td>
<td width="25%" bgcolor="white" align="center"><a href="#"><img src="images/n3.jpg"><p>Buket №1</p></a>
</td>
<td width="25%" bgcolor="white" align="center"><a href="#"><img src="images/n4.jpg"><p>Buket №1</p></a>
</td>
</tr>
</table>
<hr>
<table>
<tr>
<td width="20%"><p>gullerdunyasi.uz</p></td>
</tr>
</body>
</html>
Na’tiyje: