HTML kodlarga izoh
HTML kodlarni tahrirlashni oson kechishini ta'muinlash uchun turli izohlarni kiritish maqsadga muvofiq. Izohlar yordamida siz HTML kodlarni qayerda boshlanib, qayerda yakunlanganini muntazam kuzatib borasiz va adashib ketmaysiz .
Misol uchun siz hozirgina o'quv qo'llanmadagi jadvallar tuzish bilan bog'liq bo'lgan eng katta bo'limlardan birini o'qib chiqdingiz. Murakkab web sahifalar tuzganda ishlatiladigan HTML kodlar soni cheksiz ko'payib ketishi mumkin. Bunday paytda HTML kodlarni qayerdan boshlanib qayerda yakun topganini adashtirib yuborishingiz aniq. Shu sababli teg ocxilganda va u yopilganda izoh bilan belgilab borish lozim. Quyidagi misolda izohli HTML kodlar tizimi keltirilgan:
Bu sxema sizga jadvalli sahifani oson tahlil qilish imkonini beradi hamda turli o'zgartirishlar kiritgan taqdiringizda, uni qaysi joyda bo'lishini aniq belgilay olasiz.
Bazida ozingiz ham mana shunday sxemalarni tuzishingiz mumkin va sahifa tayor bo'lgach, kiritilgan izohlarni o'chirib tashlang. Bunda kiritilgan izoh quyidagi tartibda yozilishi lozim: '<!-- izoh -->' .
Murakkab jadval tuzish shartlari
Murakkab jadval qo'llanilgan web sahifa yaratganda quyidagi oddiy shartlarga rioya qilishga harakat qiling. Bu sizga murakkab sahifalarni yaratishni osonlashtiradi.
• Eng avvalo yaratilishi lozim bo'lgan sahifa andozasini chizib oling
HTML kodlarni yozishdan oldin sahifa andozasini qog'ozga tushirib oling. Sahivaning asosini belgilab beruvchi tashqi jadval ko'rinishini qog'ozga tushiring
• Sahifa tuzilishini alohida bo'laklarga bo'lib oling
Tashqi jadvalni belgilang. Zarur bo'lganda tashqi jadval kataklari ichidagi ichgi jadvallarni belgilang. Har bir jadval, u hoh tashqi bo'sin, hoh ichki bo'lishidan qatiy nazar katakchalar tuzilishini chizib oling.
• HTML kodlarni izohlar bilan ajrating
Siz zarur deb topgan HTML kodlarni izohlab o'ting. Shuni yodda tutinki, siz HTML kodlar bilan ishlashni chuqur o'rganib olguningizga qadar bu usul sizga ko'p az qotadi.
<TR>, <TD>, <TABLE> teglarini asosiy xususiyatlari:
Border - chetlarida chiziqni semizligi.
Align -qaysi tomonga yondashishi.
Valign -vertikal yondashish.
Nowrap - hujralardagi ma’lumot bitta qatorda ekranga yoziladi.
Colspan - qancha hujralar bir biri bilan birlashadi.
Rowspan-vertikal shakildagi qancha hujra birlashadi.
Misol:
<HEAD>
<TITLE>O’quvcxilar ro’yhati </TITLE>
</HEAD>
<BODY >
<TABLE border=1>
<TR ><TD colspan=2> O’quvcxilar ro’yhati </TD></TR>
<TR><TD align=center> Ismi</TD><TD align=center>Familyasi</TD></TR>
<TR><TD align=left> Alisher</TD><TD align=left>Z…</TD></TR>
<TR><TD align=left>Sinch </TD><TD align=left>A….</TD></TR>
</TABLE>
<A href=main.htm>Asosiy oynaga qaytish</A>
</BODY>
</HTML>
Va ekranga quyidagi tablitsa chiqadi
Agarda bir qatorga ham rasm, hamda qandaydir ma’lumot yozmoqchi bo’lsangiz undachi?
Unda quyidagi misolga qarang
<HEAD>
<TITLE>O’quvcxilar ro’yhati </TITLE>
</HEAD>
<BODY >
<TABLE border=1>
<TR ><TD colspan=2> O’quvcxilar ro’yhati </TD></TR>
<TR><TD align=center> Ismi</TD><TD align=center>Rasmi</TD></TR>
<TR><TD align=left> Alisher</TD><TD align=left><IMG src=test.gif></TD></TR>
<TR><TD align=left>Sinch </TD><TD align=left><IMG src=sinch.jpg></TD></TR>
</TABLE>
<A href=main.htm>Asosiy oynaga qaytish</A>
</BODY>
</HTML>
Tablitsalar kelajakta sizga judayam qo’l keladi, iloji boricha ko’proq ishlating, va iloji
boricha chuqurroq o’rganishga harakat qiling.
Endi rasmlardan karta shakilda linklarni ulashni o’rganamiz.
Buning uchun <MAP> tegini ishlatamiz.
<MAP
name=text>
<AREA
SHAPE= RECT | CIRCLE | POLY | DEFAULT
COORDS=”x, x, x, x”
HREF=url
>
</MAP>
Misol:
<BODY >
<MAP NAME="test">
<AREA SHAPE="rect" COORDS="0, 0, 50, 50" HREF="http://uzinfo.rbcmail.ru">
<AREA SHAPE="rect" COORDS="50, 50, 100, 100" HREF="http://technoidea.boom.ru">
</MAP>
</BODY>
Iloji boricha ko’proq misollarda ko’rib chiqing.
Rect - bu bizga linkni to’rtburchak shaklida beradi.
Cyrcle - aylana shaklida.
Defualt - to’rburchak shaklida.
Poly - siz hohlagan shakilda linkni ekranga beradi.
COORDS - bu yerda siz kerakli boshlanish va tugash nuqtalarini belgilaysiz.
Yana bizga kerak bo’ladigan quyidagi teglarni ham ko’raylik.
<OL>, <LI> bular bizga agarda ro’yhat qilmoqchi bo’lsak kerak bo’ladi.
Ro’yhatimiz OL tegi bilan boshlanadi va har bir qatori LI bilan qo’sxiladi.
<OL
type=A | a | I | i | 1
title=text
start=text
>
A - bu ro’yhatnin boshi harflar bilan bo’shlanadi va katta harflar bilan
a - esa kichkina harflar bilan
ya’ni:
A. birinchi qator B. ikkinchisi C. bu esa uchinchi
yoki: a. birinchi b. ikkinchi c. uchinchi qator
I - bu esa rim raqalarini qo’yadi.
i - bu esa kichik rim raqalari.
1 - esa arab raqalarida.
Mana ikkala misolni farqini ko’rishingiz mumkindir. Har qanday ro’yhatlarni shu
kabi yozish juda ham oson bo’ladi. Iloji boricha shu tegni ishlatishga harakat qiling.
Agarda sizga lug’at shaklida bir ro’yhat kerak bo’lachi? Unda <DL> <DD> <DT>
teglari yordamga keladi.
DL tegi bilan boshlaysiz, DT tegi bilan kerakli so’zni yozasiz, va DD tegi bilan esa
uni tarifini yozishingiz mumkindir.
Misol:
<HEAD>
<TITLE>O’zbekcha lug’at </TITLE>
</HEAD>
<BODY >
<H1> Lug’at</H1>
<DL title=”Lug’at”>
<DT>Yunusobod
<DD> Uzbekiston davlatidagi, Toshkent shahridagim tuman
<DT>HTML
<DD> Web sahifalar yozish tili
<DT>Sinch
<DD> Shu kitob aftori
</DL>
</BODY>
</HTML>
Judaham, online lug’at yoki bir katalokka tarif berishda qo’l keladi.
Keling, yana bir tegni ko’raylik. Ahamiyat bergan bo’lsangiz, ba’zi bir web
sahifalarda yozuvlar, u joydan - bu joyga yuradi, shuni qanday qilish mumkin?
Bizga <MARQUEE> taqi yordam beradi. Shu tegni ko’rib chiqaylik:
<MARQUEE
BEHAVIOR= ALTERNATE | SCROLL | SLIDE
DIRECTION= DOWN | LEFT | RIGHT | UP
>
ALTERNATE - bir burchakdan ikkinchisiga borib keladi.
SCROLL - Bir tarafdan chiqib ikinchi tarafga kirib ketadi va shunday qaytarilib turadi.
SLIDE - SCROLL kabi lekin faqatgina bir marotaba ishlaydi.
Misol:
<HEAD>
<TITLE>O’zbekcha lug’at </TITLE>
</HEAD>
<BODY >
<H1> Lug’at</H1>
<DL title=”Lug’at”>
<DT>Yunusobod
<DD> Uzbekiston davlatidagi, Toshkent shahridagim tuman
<DT>HTML
<DD> Web sahifalar yozish tili
<DT>Sinch
<DD> Shu kitob aftori
</DL>
<P>
<MARQUEE BEHAVIOR=ALTERNATE DIRECTION=RIGHT>Bizning o’zbeckcha
lug’atimiz</MARQUEE>
</BODY>
</HTML>
Copyright © Joomla Inc. All Rights Reserved.
E-DASTUR.UZ - 2010 
Professional Templates
