آموزش عنصر iframe و کاربرد آن در HTML
با سلام . همانطور که در پست های قبل به شما قول داده بودیم که عناصر HTML را به شما آموزش دهیم، امروز نیز هدف از این پست این است که به آموزش عنصر iframe و کاربرد آن در HTML برای شما کاربران عزیز بپردازیم . امیدواریم این مقاله برای شما نیز مفید باشد. با ما همراه باشید.
عنصر iframe و کاربرد آن در HTML
برچسب iframe فریم های درون خطی را معیـن می کند . فریم های درون خطی برای جاسازی مدرک ی دیگر در مدرک HTML فعلی بهره گیری خواهد شد. عنصر iframe یا عنصر فریم های درون خطی HTML ، بطور اثر گذار یک صفحه HTML دیگر در صفحه جاری تعبیه می کند .
مثال ۱:
<p>Your browser does not support iframes.</p>
<p>Your browser does not support iframes.</p>
</p> <p> <p>Your browser does not support iframes.</p></p> <p>
</p> <p> <p>Your browser does not support iframes.</p></p> <p>
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
تفاوت میـان HTML 4.01 وHTML5
در HTML5 خصوصیت های تازه اضافه شده و چندین خصوصیت HTML 4.01 هم از HTML5 پاک شده می باشد.
تفاوت میـان HTML و XHTML
در XHTML، خصوصیت name کهنه شده و پاک خواهد شد. به جای آن از خصوصیت id بهره گیری نمایید .
عنصر iframe و کاربرد آن در HTML
عنصر iframe و کاربرد آن در HTML
ویژگی های عنصر iframe
تگ HTML خواهـد توانست حاوی یک یا چند خصوصیت باشد که چگونگی عرضه در مرورگر را مشـخص میکنند. خصوصیت ها حاوی یک نام و یک مقدار می باشند که با علامت (=) از هم جدا شده اند. مقدار خصوصیت با علامت نقل قول احاطه می شود .
۳ نوع خصوصیت وجود دارد که شما خواهید توانست به تگ های HTML خود اضافه نمایید :
ویژگی خاص عنصر
ویژگی عمومی
ویژگی رویداد
ویژگی های خاص عنصر iframe
| خاصیت | مقدار | شرح |
| align | left right top middle bottom | در HTML5 حمایت نمی شود چیدمان iframe را با دقت به عناصر اطراف آن معیـن می کند |
| frameborder | ۱ ۰ | در HTML5 حمایت نمی شود مقدار ۱ (مقدار پیش فرض) به مرورگر می گوید که بین این قاب و هر قاب دیگر یک مرز مشـخص نمایید . ولی مقدار ۰ به مرورگر می گوید که میـان این فریم و فریم های دیگر مرزی وجود ندارد ه باشد |
| height | pixels | ارتفاع iframe را مشـخص می کند |
| longdesc | URL | در HTML5 حمایت نمی شود صفحه ای که حاوی توضیحاتی از محتوای iframe است را معیـن می کند |
| marginheight | pixels | در HTML5 حمایت نمی شود حاشیه بالا و زیـر محتوای iframe را مشـخص می کند |
| marginwidth | pixels | در HTML5 حمایت نمی شود حاشیه چپ و راست محتوای iframe را تعیین می کند |
| name | text | اسم IFRAME را مشـخص می کند |
| sandbox جدید | “” allow-forms allow-same-origin allow-scripts allow-top-navigation | گروه محدودیت های زیادتری را برای محتوای iframe فعال می کند |
| scrolling | yes no auto | در HTML5 حمایت نمی شود مشخص می کند که اسکرول مرتبه در iframe نشان داده گـردد یا خیر |
| seamless جدید | seamless | مشخص می کند که iframe می بایست مثل قسمتـی از مدرک ِ در برگیرنده آن به نظـر برسد. |
| src | URL | آدرس مدرک ی که در iframe قرار میگرد را مشخص می کند |
| srcdoc جدید | HTML_code | محتوای iframe صفحه را برای نمایش در iframe معیـن می کند |
| width | pixels | عرض iframe را مشـخص می کند |
ویژگی های عمومی عنصر iframe
برچسب iframe از خصوصیت های عمومی HTML حمایت می کند
| accesskey | hidden | itemtype |
| class | id | lang |
| contenteditable | inert | spellcheck |
| contextmenu | itemid | style |
| dir | itemprop | tabindex |
| draggable | itemref | title |
| dropzone | itemscope | translate |
ویژگی های رویداد عنصر iframe
برچسب iframe از خصوصیت های رویداد در HTML هم حمایت می کند .
| onabort | onended | onmousewheel |
| oncancel | onerror | onpause |
| onblur | onfocus | onplay |
| oncanplay | onformchange | onplaying |
| oncanplaythrough | onforminput | onprogress |
| onchange | oninput | onratechange |
| onclick | oninvalid | onreadystatechange |
| oncontextmenu | onkeydown | onscroll |
| ondblclick | onkeypress | onseeked |
| ondrag | onkeyup | onseeking |
| ondragend | onload | onselect |
| ondragenter | onloadeddata | onshow |
| ondragexit | onloadedmetadata | onstalled |
| ondragleave | onloadstart | onsubmit |
| ondragover | onmousedown | onsuspend |
| ondragstart | onmousemove | ontimeبروزرسانی |
| ondrop | onmouseout | onvolumechange |
| ondurationchange | onmouseover | onwaiting |
| onemptied | onmouseup |
حمایت از مرورگر ها
برچسب iframe در تمام مرورگرهای مهـم مثل اینترنت اکسپلورر، فایرفاکس ، اپرا ، گوگل کروم و سافاری حمایت می شود .
تنظیمات پیش فرض CSS :
بیشتر مرورگر ها عنصر iframeرا با مقادیر پیش فرض پایین مشخص میکنند:
iframe:focus { outline: none; } iframe[seamless] { display: block; }
| 1 2 3 4 5 6 7 | iframe:focus { outline: none; } iframe[seamless] { display: block; } |
به پایان مقاله آموزش عنصر iframe و کاربرد آن در HTML رسیدیم. از توجه و همراهی شما سپاسگزاریم . منتظر آموزش عناصر دیگر HTML در این سایت باشید.
شاد و پیرووز باشید.