id Attribute

Id deganda   takrorlanmas yogona bo'lgan raqam yoki matn nazarda tutiladi.

HTML da id atributi  element uchun takrorlanmas  matn (kalit) berish uchun ishlatiladi.

HTML hujjatida bir xil idga ega bo'lgan bir nechta element bo'lshi mumkin emas. Bu degani bitta elementda bitta id bo'ladi uni idsini boshqa element ishlata olmaydi.

id attributi

Html da xam bitta elementga id atribute yozish mumkin.  Bitta  idni bitta element ishlatishi mumkin.  Bitta id ni 2ta element ishlata olmaydi.

Css da ham id tushunchasi bor.  Css da ham id orqali html elementga stillar yozish mumkin.

Css da id nomi  #  ishorasidan keyin yoziladi.

Namuna

<!DOCTYPE html>
<html>
<head>
<style>
#myHeader {
  background-color: lightblue;
  color: black;
  padding: 40px;
  text-align: center;
}
</style>
</head>
<body>

<h1 id="myHeader">Sarlavha</h1>

</body>
</html>

Namunada myHeader   degan id yozilgan. U css da  #myHeader  deb yozilgan sababi css da idlar # ishorasi bilan boshlanadi.  

Html da h1 elementiga id atribut yozilgan uning qiymati  myHeader  ga teng. Va natijada h1 elementga  myHeader  da yozilgan stillar tasir qildi.

 

Eslatma Id da katta va kichik harflar farq qiladi. Masalan myId  bilan myid ni farqi bor. Bular 2ta turli id hisoblanadi.

Id yozayotganda eng kamida 1ta raqam yozish kerak va boshliklar bo'lishi mumkin emas.

 

Class va Id farqi.

class  bir nechta HTML elementlari tomonidan ishlatilishi mumkin. 

id  esa faqat bitta HTML elementi tomonidan ishlatilishi kerak.

Namuna

<!DOCTYPE html>
<html>
<head>
<style>
#myHeader {
  background-color: lightblue;
  color: black;
  padding: 40px;
  text-align: center;
}
.shahar {
  background-color: tomato;
  color: white;
  padding: 10px;
} 
</style>
</head>
<body>

<h2>class va id o'rtasidagi farq</h2>
<p>class  bir nechta HTML elementlari tomonidan ishlatilishi mumkin. <br>
  id  esa faqat bitta HTML elementi tomonidan ishlatilishi kerak.</p>

<!-- ushbu element takrorlanmas id nomini oladi -->
<h1 id="myHeader">Mening Shahrim</h1>

<!-- Turli  -->
<h2 class="shahar">London</h2>
<p>Angilyaning poytaxti London</p>

<h2 class="shahar">Paris</h2>
<p>Fransiyaning poytaxti Paris</p>

<h2 class="shahar">Tokyo</h2>
<p>Yaponiyaning poytaxti Tokyo</p>

</body>
</html>

Namunada  shahar  klasini  3ta element ishlatyapdi ammo myHeader degan id ni bor yo'gi bitta element ishlatyapdi.

Css darslarimizda Css haqida ko'proq ma'lumot olsangiz bo'ladi.

 

HTML Bookmarks with ID and Links

Html Bookmarks deganda veb saxifani qaysidir qismini belgilab qo'yish nazarda tutiladi.

Bookmarks htmlda web saxifani belgilangan qismiga sakrab o'tish uchun ishlatiladi. 

Agar sizning web saxifangiz katta bo'lsa saxifaning qaysidir qismida sakrab o'tish uchun html bookmarks  dan foydalangan yaxshi.

Html Bookmarks dan  foydalanish uchun oldin bookmark yaratiladi va uni link (havola) ga ulanadi.

Endi qachon link bosilganda o'sha link bog'langan bookmark ga  veb saxifa skroll bo'ladi.

Namuna

Belgilangan (sakrab o'tilishi kerak bo'lgan) elementga id attribuni yozamiz.

<h2 id="M4">Mavzu 4</h2>

Qandaydir link yaratiladi va bookmark ga link qilib qo'yamiz.

     <a href="#M4">4-chi mavzuga O'tish</a