HTML5 Brauzerlarda Qo’llab-Quvvatlanishi

HTML5 Brauzerlarda Qo’llab-quvvatlanishi


Siz eski brauzerlarga ham HTML5 ni to’g’ridan to’g’ri ishlatishingiz mumkin!


HTML5 Brauzer Qo’llab Quvvatlanishi

HTML5 ni barcha zamonaviy brauzerlar qo’llab- quvatlaydi

Shuningdek, barcha brauzerlar avtomatik tarzda aniqlanmay qolgan elemetlarni ichki element sifatida qo’llaydi.

Shu sababdan, HTML ning aniqlanmay qolgan elementlarini eski brauzerlar orqali ham foydalana olishga yo’naltirilsa bo’ladi boladi.

...   Eng qizigi shundaki IE6(Windows XP 2001) uchun ham ushbu yangi elementlarni qo’llash mumkin.


HTML5 Elementlarini Blok Elementlari Kabi Kiritish

HTML5 sakkizta yangi semantik elementlarni o’z ichiga oladi. Ulaning barchasini block elementlari kabi kiritish mumkin.

Eski brauzerlarda sahifa to’g’ri aks etishi uchun, CSS ning display tavsifini block deb belgilash kerak:

header, section, footer, aside, nav, main, article, figure {
  display: block;
}

HTML ga Yangi Elementlar Qo’shish

HTML uchun bir necha brauzer usullari yordamida yangi elementlar qo’shish mumkin.

Ushbu misol yordamida <yangiTeg> elemtini style yordamida qo’shishni sinab ko’ramiz:

Namuna:

<!DOCTYPE html>
<html>
<head>
  <title>HTML da yangi element qo’shish </title>
  <script>document.createElement("yangiTeg") </script>
  <style>
  yangiTeg {
      display: block;
      background-color: #ddd;
      padding: 50px;
      font-size: 30px;
  }
  </style>
</head>
<body>

<h1>Birinchi Sarlavham</h1>

<p>Birinchi paragrafim </p>

<yangiTeg>Mening Birinchi Elementim</yangiTeg>

</body>
</html>

document.createElement(&qout;doppi&qout;) skripti faqat Internet Explorer brauzerini qanoatlantirish sifatida qo’shilgan


Internet Explorer bilan Bog’liq Bo’lgan Muammolar

Siz yuqoridagi barcha misollarni HTML5 da ishlatishingiz mumkin, biroq:

...   Internet explorer 8 va undan oldingi brauzerlar notanish elementlarni ishlatilishiga yo’l qo’ymaydigan qilib yaratilgan.

Shuning uchun Sjoerd Visscher "HTML5 uchun JavaScript" hamda "the shiv" larni yaratgan:

<!--[if lt IE 9]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"</script>
<![endif]-->

Yuqoridagi komment(izoh) ichidagi kodni IE9 avtomatik tarzda ozi qayta ishlaydi


Shiv yechimining to’laqonli ko’rinishi

Namuna:

<!DOCTYPE html>
<html>
<head>
  <title>Styling HTML5</title>
  <!--[if lt IE 9]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->
</head>
<body>

<h1>Mening birinchi maqolam

<article>
Toshkent O’zbekiston Respublikasining Poytaxtidir. Toshkent aholisi 6 milliondan oshiqdir.
</article>

</body>
</html>

shiv kodi <head> elementi ichiga joylashtirish kerak, chunki Internet Explorer dastaval aynan shu qismni ko’zdan kechirib chiqadi.


HTML5 Skeleti

Namuna:

<!DOCTYPE html>
<html lang="uz">
<head>
<title>HTML5 Asosiy qismi</title>
<meta charset="utf-8">

<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js">
</script>
<![endif]-->

<style>
body {font-family: Verdana, sans-serif; font-size:0.8em;}
header,nav, section,article,footer
{border:1px solid grey; margin:5px; padding:8px;}
nav ul {margin:0; padding:0;}
nav ul li {display:inline; margin:5px;}
</style>
</head>
<body>

<header>
  <h1>HTML5 Asosiy qismi</h1>
</header>

<nav>
<ul>
  <li><a href="#">HTML5 Semantic</a></li>
  <li><a href="#">HTML5 Geolocation</a></li>
  <li><a href="#">HTML5 Graphics</a></li>
</ul>
</nav>

<section>

<h1>Mashhur shaharlar</h1>

<article>
<h2>Toshkent</h2>
<p>Toshkent tarixining eng muhim davrlaridan biri-Yunusxo’ja hukmronligi davridir, chunki, bu davrda shahar ancha taraqqiy topdi, o’lkadagi eng muhim strategik ahamiyatga ega bo’lgan markazga aylandi.</p>
</article>

<article>
<h2>Parij</h2>
<p>Paris fransiyaning poytaxti bo’lib, u fransiyaning eng chiroyli shaharlaridan biri.</p>
</article>

<article>
<h2>Tokiyo</h2>
<p>Tokiyo yaponiyaning poytaxti bo’lib, u yaponiyaning eng gavjum shaharlaridan biri sanaladi.</p>
</article>

</section>

<footer>
<p>© 2016 keepgoing.uz.</p>
</footer>

</body>
</html>

Innovative Lab web sahifasiga xush kelibsiz biz bilan birga IT sohasidagi o'z bilimlaringizni bosqichma-bosqich oshirib boring!


Telegram kanalimizdan kunlik darslarni o'rganing  

TOSHKENT SHAHRIDAGI INHA UNIVERSITETI - 2017