ایچ تی ایم ایل5 بروز رسانی کریئر

آپ کسی بھی قدیمی براوزر کو HTML5 کا انتظام کرسکتا ہیں。

ایچ تی ایم ایل5 بروز رسانی کریئر

همه مرورگرهای مدرن از HTML5 پشتیبانی می‌کنند.

علاوه بر این، همه مرورگرها، چه قدیمی‌باشند چه جدید، به طور خودکار عناصر غیرشناخته شده را به عنوان عناصر خطی (inline) در نظر می‌گیرند.

به همین دلیل، می‌توانید به مرورگرهای قدیمی‌تر کمک کنید تا عناصر HTML "ناشناخته" را پردازش کنند.

توضیح:حتی می‌توانید به IE6 از عصر سنگی یاد دهید که چگونه عناصر HTML ناشناخته را پردازش کند.

عناصر HTML5 را به عنوان عناصر بلاک تعریف کنید

HTML5 هشت عنصر جدید语义 عناصر HTML. همه ازبلاکعنصر.

CSS را می‌توانید به عنوان display تنظیم شده به block، تا از رفتار صحیح در مرورگرهای قدیمی‌تر اطمینان حاصل شود:

مثال

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

عناصر جدید به HTML اضافه کردن

می‌توانید با استفاده از فریب مرورگر، هر عنصر جدیدی را به HTML اضافه کنید:

این مثال یک عنصر به نام <myHero> برای تعریف استایل display برای عناصر جدید

مثال

<!DOCTYPE html>
<html>
<head>
  <title>Creating an HTML Element</title>
  <script>document.createElement("myHero")</script>
  <style>
  myHero {
    display: block;
    background-color: #ddd;
    padding: 50px;
    font-size: 30px;
  } 
  </style> 
</head>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
<myHero>My First Hero</myHero>
</body>
</html>

آزمایش کنید

عبارت‌های اضافه شده به JavaScript document.createElement("myHero")، تنها برای IE مناسب است.

مشکلات اینترنت اکسپلورر

این راهکار برای همه عناصر جدید HTML5 قابل استفاده است، اما:

توجه:اینترنت اکسپلورر 8 و نسخه‌های قبلی آن، اجازه نمی‌دهد که به عناصر ناشناخته استایل اضافه شود.

خوشبختانه، Sjoerd Visscher "HTML5 Enabling JavaScript" را ایجاد کرده است "the shiv":

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

این کد یک توضیح است، اما نسخه‌های اولیه IE9 آن را می‌خواند (و آن را درک می‌کند).

پورا شِوو حلقة حل

مثال

<!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>مقاله اولین من</h1>
<article>
لندن پایتخت انگلستان است. 
این بیشترین جمعیت شهری در بریتانیا است, 
با مساحت شهری بیش از 13 میلیون ساکن.
</article>
</body>
</html>

آزمایش کنید

لینک‌های کد shiv باید در عناصر <head> قرار گیرند، زیرا اینترنت اکسپلورر باید تمام عناصر جدید را قبل از خواندن بشناسد.

HTML5 Skeleٹن

مثال

<!DOCTYPE html>
<html lang="en">
<head>
<title>skeleٹن HTML5</title>
<meta charset="utf-8">
<![if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
</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>skeleٹن HTML5</h1>
</header>
<nav>
<ul>
  <li><a href="html5_semantic_elements.asp">عناصر معنوی HTML5</a></li>
  <li><a href="html5_geolocation.asp">HTML5 جغرافیایی</a></li>
  <li><a href="html5_canvas.asp">تصاویر HTML5</a></li>
</ul>
</nav>
<section>
<h1>شهرهای معروف</h1>
<article>
<h2>لندن</h2>
<p>لندن پایتخت شهر انگلستان و پر جمعیت‌ترین شهر در بریتانیا است,</p>
<p>با منطقه شهری بیش از ۱۳ میلیون جمعیت.</p>
</article>
<article>
<h2>پاریس</h2>
<p>پاریس پایتخت و پر جمعیت‌ترین شهر فرانسه است.</p>
</article>
<article>
<h2>توکیو</h2>
<p>توکیو پایتخت ژاپن و مرکز منطقه بزرگ توکیو است,</p>
و بزرگترین منطقه شهری پر جمعیت در جهان.</p>
</article>
</section>
<footer>
<p>© 2016 CodeW3C.com. تمام حقوق محفوظ است.</p>
</footer>
</body>
</html>

آزمایش کنید