Tuesday, May 27, 2014

HTML darslari 4-dars. HEAD tegi.


Assalomu alaykum Hurmatli o'quvchilar!
HTML ni o'rganishni davom ettiramiz. Ushbu darsimizda
<HEAD>
tegi bilan ishlashni o'rganib chiqamiz.
Ho'sh bu teg nima uchun kerak va nima uchun ishlatiladi? Degan savolga javob olasiz degan umiddamiz.


Bilamizki barcha teglar
<HTML></HTML>
teglarini ichida yoziladi.
Keling sodda qilib tushuntirishga harakat qilaman:
Odam — bu
<html></html>
tegi deb tasavvur qilamiz.
<head></head>
— bu odamning bosh qismi( ya'ni kallasi).
<body></body>
— nomidan ham ma'lumki, bu odamni badani.
<head></head>
teglari teglarini ichida yoziladi va
<body></body>
tegining yuqori qismida yoziladi.
Esda tuting,
<head></head>
teglari
<body>
teglarini orasida yozilmaydi.

<html>
<head>
...</head>
     <body>
        ...
     </body>
</html>

Ya'ni yuqoridagi strukturada yoziladi.

HEAD — teglarini ichiga biz css kodlar, javascript kodlar, va web sahifa uchun kerakli elementlarni, teglarni yozishimiz mumkin.
Quyidagi teglarni yozishimiz mumkin:
<title>
<style>
<meta>
<link>
<script>
<noscript>
<base> 


<title>
— tegi.
Nomidan ham am'lumki, web sahifa nomini ko'rsatish uchun ishlatiladi.
Misol:
<html>
<head>
<title>Mening birinchi web sahifam</title>
</head>
<body>
   Web sahifaning tana qismi...</body>
</html>

Ushbu kodni o'zingiz ham yozib tekshirib ko'ring. htmledit.squarefree.com
Ushbu kodni ishlatib browserda ochib, browseringizni tep qismiga qarang, va siz «Mening birinchi web sahifam» yozuvini ko'rasiz.

<link>
— tegi.
Bu tegni web sahifani boshqa fayllar bilan boglash uchun ishlatamiz, misol uchun css fayl bilan boglash uchun.
Misol:
<html>
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
<title>Mening birinchi web sahifam</title>
</head>
<body>
   Web sahifaning tana qismi...</body>
</html>

Ushbu kodni o'zingiz ham yozib tekshirib ko'ring. htmledit.squarefree.com
Yani ushbu misolda mystyle.css nomli css faylga bog'lash uchun ishlatilyapti.

<style>
— tegi.
Ushbu teg web sahifaga stil berish uchun ishlatiladi.
Misol:
<html>
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
<head>
<style type="text/css">
body {
        background-color:yellow;
}
p {
        color:red;
}
</style>
</head>
<title>Mening birinchi web sahifam</title>
</head>
<body>
   <p>Web sahifaning tana qismi...</p>
</body>
</html>

Ushbu kodni o'zingiz ham yozib tekshirib ko'ring. htmledit.squarefree.com

CSS haqida keyingi darslarimizni kuzatib boring, CSS darslarini ham albatta qo'yib borishga harakat qilamiz.

<script>
— tegi.
Ushbu teg ichiga
JavaScript
kodlarini yozishimiz mumkin.

Bu darsimizda qo'ldan kelgancha teglarni tushuntirishga harakat qildim. Qolgan teglarni ham asta sekinlik bilan o'ranib boramiz.
Keyingi darslarimizni kuzatib boring.