بهترین سایت برای توسعه دهندگان وب

دروس HTML5

شروع HTML مقدمه HTML ویرایشگران HTML مثالهای اساسی HTML المان های HTML ویژگی های HTML عناوین HTML بندهای HTML سبک های HTML قالب بندی HTML نقل قول های HTML نظرات HTML رنگهای HTML HTML و CSS پیوندهای HTML تصاویر HTML جداول HTML لیست های HTML بلوک های HTML کلاس های HTML شناسه های HTML فریم های HTML HTML و JavaScript مسیرهای پرونده HTML HTML قسمت هدینگ چیدمان های HTML HTML پاسخگو کد رایانه HTML موجودیت HTML نمادهای HTML رمزگذاری HTML رمزگذاری URL HTML HTML و XHTML

HTML فرم ها

فرم های HTML المان های فرم HTML انواع ورودی HTML صفات ورودی HTML

HTML5

مقدمه HTML5 پشتیبانی HTML5 المان های جدید HTML5 المان های معنایی HTML5 مهاجرت از HTML4 راهنمای سبک HTML5

HTML گرافیک

HTML Canvas HTML SVG

HTML رسانه

HTML ویدیوی HTML صوت HTML افزونه های HTML یوتیوب HTML

HTML API

مکان جغرافیایی HTML کشیدن / رها کردن HTML HTML ذخیره وب HTML کارهای وب HTML و SSE

HTML مثال

مثالهای HTML آزمون ها HTML تمرینات HTML گواهی HTML خلاصه HTML قابلیت دسترسی به HTML

HTML منابع

لیست برچسب های HTML صفات HTML صفات جهانی HTML رویدادهای HTML رنگهای HTML کانواس HTML صوتی / تصویری HTML نسخه معتبر HTML مجموعه نویسه های HTML رمزگذاری URL HTML رمزگذاری زبان HTML پیام های HTTP روشهای HTTP مبدل PX به EM میانبرهای صفحه کلید

HTML5 درسهایی برای مبتدیان

پشتیبانی مرورگرها HTML5


می توانید به مرورگرهای قدیمی آموزش دهید که به درستی از HTML5 استفاده کنند.


پشتیبانی مرورگرها HTML5

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

علاوه بر این ، همه مرورگرها ، قدیمی و جدید ، به طور خودکار المان های ناشناخته را کنترل می کنند به عنوان المان های جاسازی شده .

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

حتی می توانید به IE6 در windows XP یاد دهید چگونه کد ها را نمایش دهد


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

HTML5 هشت المان معنایی جدید را تعریف می کند. همه آنها المان های سطح بلوک هستند.

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

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

المان های جدیدی به 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> یک عنوان </h1>
<myHero>المان قهرمان من </myHero>

</body>
</html>
خودتان آزمایش کنید »

برای ایجاد یک المان جدید در IE 9 و نسخه های قبل از آن ، به JavaScript statement کد document.createElement("myHero") نیاز است.


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

برای همه المان های جدید HTML5 می توانید از راه حل بالا استفاده کنید.

با این حال ، IE8 (و نسخه های قبلی) اجازه نمی دهد که المان های ناشناخته طراحی شوند!

اما خدا را شکر Sjoerd Visscher HTML5Shiv را ایجاد کرد! HTML5Shiv یک راه حل جاوا اسکریپت است که می تواند المان های HTML5 را در نسخه های اینترنت اکسپلورر قبل از نسخه 9 فعال کند.

شما برای سازگاری با مرورگرهای IE قدیمی تر از IE 9 به HTML5shiv نیاز دارید


نحو برای HTML5Shiv

HTML5Shiv درون برچسب <head> است.

HTML5Shiv یک پرونده جاوا اسکریپت است که با برچسب <script> به آن ارجاع می شود.

وقتی از المان های جدید HTML5 مانند: <article> ، <section>، <aside> ،<nav> ، <footer> استفاده می کنید ، باید از HTML5Shiv استفاده کنید.

می توانید جدیدترین HTML5shiv را از github بارگیری کنید یا پیوندی به نسخه CDN https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js اضافه کنید (یا به جای آن نسخه جدیدتری در سایت ما: html5shiv.js )

نحو

<head>
  <!--[if lt IE 9]>
    <script src="/js/html5shiv.js"></script>
  <![endif]-->
</head>

مثال HTML5Shiv

اگر نمی خواهید اسکریپت HTML5Shiv را در سایت خود بارگیری و ذخیره کنید ، می توانید به آن پیوند دهید نسخه ، ذکر شده در وب سایت CDN.

اسکریپت HTML5Shiv معمولاً پس از هر صفحه سبک در المان <head> قرار می گیرد:

مثال

<!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> شهرهای معروف </h1>

<article>
<h2>لندن</h2>
<p>لندن است سرمایه، پایتخت شهر انگلستان این شهر پرجمعیت ترین شهر انگلستان است که بیش از 13 شهر کلانشهر دارد میلیون نفر</p>
</article>

<article>
<h2>پاریس</h2>
<p>پاریس پایتخت و پرجمعیت ترین است شهر از فرانسه.</p>
</article>

<article>
<h2>توکیو</h2>
<p>توکیو پایتخت ژاپن ، مرکز منطقه بزرگ توکیو است ، و پرجمعیت ترین منطقه شهری در جهان است.</p>
</article>

</section>

</body>
</html>
خودتان آزمایش کنید »

توجه کنید . گاهی اوقات پیوندی به اسکریپت HTML5Shiv در انتهای صفحه وب قبل از برچسب </body> قرار داده می شود (برای سرعت بخشیدن به بارگذاری صفحه).






این سایت برای آموزش ، آزمایش و یادگیری بهینه شده است. نمونه ها را می توان برای بهبود ساده کرد خواندن و درک اساسی. آموزشها ، پیوندها و مثالها مرتباً تجدید نظر می شوند تا از آنها جلوگیری شود خطاها ، اما ما نمی توانیم صحت و عملکرد کامل همه مطالب را تضمین کنیم. با استفاده از این سایت ، شما موافقت می کنید که مطالعه کرده اید و پذیرفته ایدمقررات استفاده , کوکی و سیاست های حفظ حریم خصوصی. کپی رایت 1999-2020 حق چاپ و .. محفوظ توسط احمد فرجی
سایت توسط چارچوب farsiw3.ir طراحی شده است.

Farsiw3.ir