پشتیبانی مرورگر در HTML5 و HTML
پشتیبانی مرورگر در HTML5 و HTML
رفع مشکل HTML5 در مرورگر های مختلف
چگونه میتوانیم در مرورگر های قدیمی از HTML5 استفاده کنیم؟ چگونه میتوانیم مشکل HTML5 را در مرورگرهای قدیمی حل کنیم؟ آشنایی با پشتیبانی مرورگر ها از HTML5 موضوع اصلی مقاله امروز ماست. پس با ما همراه باشید.
- 1 پشتیبانی مرورگر در html5
- 1.1 تعریف عناصر معنایی به عنوان عناصر بلوکی
- 1.2 تعریف عنصر جدید به html
- 1.3 مشکلات مرورگر اینترنت اکسپلورر 8
- 2 قواعد html5shiv
پشتیبانی مرورگر در HTML5 و HTML
شما می توانید به مرورگرهای قدیمی بیاموزید چگونه به خوبی از عهده html5 برآیند.
نسخه جدید HTML یعنی HTML5 بر روی تمام مرورگر های مدرن امروزی پشتیبانی می شود، ما مقاله ای در رابطه با آشنایی با HTML5 هم نوشتیم که اگر دوست داشتید میتونید آن را هم بخوانید و با این نسخه آشنا بشید.
به علاوه، همه مرورگر ها چه قدیمی و چه جدید به صورت خودکار عناصر شناخته نشده را به عنوان عناصر برخط مدیریت می کنند.
به خاطر این مسئله، شما می توانید به مرورگر های قدیمی بیاموزید چگونه یک عنصر ناشناخته را مدیریت کنند.
تعریف عناصر معنایی به عنوان عناصر بلوکی
نسخه html5 هشت عنصر معنایی جدید تعریف شده اند. همه عناصر جدید، عناصر بلوکی هستند.
برای ساخت یک رفتار ایمن در مرورگر های قدیمی، می توانید یک خاصیت display از طریق css برای تبدیل به بلوک استفاده کنید.
header, section, footer, aside, nav, main, article, figure { display: block; } پشتیبانی مرورگر در HTML5 و HTML
تعریف عنصر جدید به html
شما می توانید همچنین عناصر جدیدی به صفحه html برای فریب مرورگر استفاده کنید.
این مثال یک عنصر جدید به اسم myhero به صفحه html اضافه می کند و به آن استایل می دهد.
<!DOCTYPE html> <html> <head> <script>document.createElement("myHero")</script> <style> myHero { display: block; background-color: #dddddd; padding: 50px; font-size: 30px; } </style> </head> <body> <h1>A Heading</h1> <myHero>My Hero Element</myHero> </body> </html>
عبارت جاوا اسکریپت document.createElement("myHero")
برای ساخت یک عنصر جدید در مرورگر IE9 و قبل آن استفاده می شود.
مشکلات مرورگر اینترنت اکسپلورر 8
شما می توانید برای این مشکل از راه حل بالا برای تمام عناصر html5 استفاده کنید.
به هر حال IE8 و نسخه های قبل از آن اجازه استایل دهی برای عناصر ناشناس را نمی دهد.
با تشکر از sjored visscher که html5shiv را خلق کرد. Html5shiv یک راه حل جاوا اسکریپتی است که اجازه استایل دهی برای عناصر html5 در نسخه IE9 و قبل از آن را می دهد.
پشتیبانی مرورگر در HTML5 و HTML
قواعد html5shiv
Html5shiv در داخل تگ <head>
قرار می گیرد.
Html5shiv یک فایل جاوا اسکریپت است که در تگ <script>
مرجع می شود.
شما باید از این اسکریپت زمانی استفاده کنید که قصد استفاده از عناصر html5 مانند <article> ، <section> ، <aside> ، <nav> ، <footer>
را دارید.
<head> <!--[if lt IE 9]> <script src="/js/html5shiv.js"></script> <![endif]--> </head>
مثال html5shiv
اسکریپت html5shiv باید در تگ <head>
و پس از همه stylesheet موجود تعریف شود.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!--[if lt IE 9]> <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> <![endif]--> </head> <body> <section> <h1>Famous Cities</h1> <article> <h2>London</h2> <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p> </article> <article> <h2>Paris</h2> <p>Paris is the capital and most populous city of France.</p> </article> <article> <h2>Tokyo</h2> <p>Tokyo is the capital of Japan, the center of the Greater Tokyo Area, and the most populous metropolitan area in the world.</p> </article> </section> </body> </html>
نتیجه گیری
در این مقاله با نحوه ایجاد پشتیبانی HTML5 با مرورگرهای قدیمی آشنا شدیم.
امیدوارم استفاده کافی را از این مقاله برده باشید.
جهت مشاهده دوره های آموزشی بر روی این لینک کلیک نمایید.
جدیدترین اخبار مجموعه فراز نتورک را در این صفحه اجتماعی دنبال کنید.
نویسنده:راحله تبریزی
دیدگاهتان را بنویسید
برای نوشتن دیدگاه باید وارد بشوید.