تگ های HTML
در مقالات Html چیست و همچنین CSS چیست با این Markup های برنامه نویسی و تاریخچه آنها آشنا شدیم. حال می خواهیم لیست کامل تگ های Html بر حسب نوع کاربردهایشان را به شما با توضیحات مختصر و مفید برای هر کدام، بیاوریم تا با عملکرد تک تک آنها در این دسته بندی آشنا شوید:
1) تگ های پایه و اصلی HTML:
| <!DOCTYPE> | مخفف کلمات Document Typeاست به معنای نوع سند | |
| <html> | نشان دهنده سند Html است | |
| <head> | بخشی که نشان دهنده اطلاعات کلی آن سند Html است | |
| <Title> | عنوان و یا تیتر موضوع آن Html است | |
| <body> | بدنه اصلی سند Html که تگ های اصلی در آن قرار می گیرند | |
| <h1> تا <h6> | مخفف Headings و یا تیتر و سرفصل موضوعات (وقتی می خواهیم عناوین یک متن یا یک بخش با حروف بزرگ نمایش داده شوند) | |
| <p> | مخفف پاراگراف | |
| <br> | مخفف کلمه Break . زمانی بکار می رود که می خواهیم بقیه نوشته ها خط پایین نشان داده شوند | |
| <hr> | جهت انداختن یک خط افقی و همچنین بزرگ کردن کلمات (در Html5) | |
| <!--...--> | جهت گذاشتن نظرات و توضیحات طراح وب (در صفحات وب این توضیحات دیده نمی شوند) |
2) تگ های فرمت متن ها در HTML:
| <blockquote> | نشان دهنده بخشی است که به عنوان نقل قول از سایتی دیگر و یا شخصی دیگر نقل شده باشد | |
| <center> | جهت وسط چین کردن متن ها بکار می رفته (در Html5دیگر پشتیبانی نمی شود) | |
| <cite> | نشان دهنده تیتر و یا عنوان آن بخش است | |
| <Code> | برای نمایش کدهای برنامه نویسی بکار می رود. | |
| <del> | نشان دهنده متن یا کلمات حذف شده. | |
| <dfn> | مخفف Defenition و نشان دهنده معنی و یا منظور از عبارت | |
| <em> | مخفف emphasized و به معنای تاکید بر روی کلمات خاصی است. | |
| <font> | نشان دهنده نوع فونت و رنگ و سایز کلمات (در Html5دیگر پشتیبانی نمی شود) | |
| <i> | نشان دهنده بخشی از متن در حالت و یا فرم خاصی است. | |
| <ins> | مخفف insert و نشان دهنده متنی که در یک سند قرار داده شده. | |
| <kbd> | مخفف keyboard و نشان دهنده ورودی های صفحه کلید کامپیوتر است. | |
| Html5 | <mark> | نشان دهنده متن های Highlight شده و یا Mark شده. |
| Html5 | <meter> | برای نمایش یک مقداری از یک نمودار افقی |
| <pre> | جهت ثابت نگه داشتن محل شروع متن ها | |
| Html5 | <progress> | نشان دهنده پیشرفت یک پروسه |
| <q> | مخفف quotation | |
| Html5 | <rp> | جهت نمایش المان هایی در مرورگر است که در زبان Ruby پشتیبانی نمی شود. |
| Html5 | <rt> | جهت توضیح کاراکترهای زبان های خاص |
| Html5 | <ruby> | نشان دهنده عبارتی از زبان برنامه نویسی Ruby |
| <s> | نشان دهنده اینکه متن مورد نظر دیگر صحیح نیست | |
| <samp> | مخفف Sample و جهت نمایش خروجی یک برنامه | |
| <small> | جهت کوچک نشان دادن حروف و متن ها | |
| <strike> | جهت نمایش متنی که باید حذف و یا اصلاح شود (در Html5دیگر پشتیبانی نمی شود) بجای آن از <s> یا <del> استفاده می شود. | |
| <strong> | جهت بزرگ نشان دادن حروف تیترها و عنوان های مهم | |
| <sub> | مخفف subscripted | |
| <sup> | مخفف superscripted | |
| <time> | جهت نمایش زمان و تاریخ | |
| <tt> | جهت نمایش Tele type ها بکار می رفته. (در Html5دیگر پشتیبانی نمی شود) | |
| <u> | نشان دهنده متنی که از بقیه متن ها ظاهرش فرق داشته باشد | |
| <var> | مخفف Variable (به معنای متغیر) | |
| <wbr> | جهت انداختن فاصله و خط به خط انداختن بین متن ها |
3) تگ های فرم ها و ورودی داده ها در HTML :
| <form> | برای ایجاد فرم | |
| <inpute> | برای ورودی فرم | |
| <textarea> | برای ایجاد فضای نوشتن متن | |
| <button> | دکمه ارسال | |
| <select> | برای لیست های کشویی (Drop Down) | |
| <optgroup> | مخفف options group | |
| <option> | انتخاب های کاربر سایت بصورت Drop Down | |
| <label> | نشان دهنده یک Label برای ورودی تگ <inpute> | |
| <fieldset> | نشان دهنده گروهی از المان های مرتبط با هم در یک فرم | |
| <legend> | نشان دهنده یک Caption (تیتر بزرگ) برای المان های <fieldset> | |
| Html5 | <datalist> | نشان دهنده انتخاب های pre-defined در ورودی inpute |
| Html5 | <output> | نتیجه یک محاسبه را بر می گرداند |
4) تگ فریم ها:
| <frame> | برای ایجاد یک frameset (یک بخش مجزا) (در Html5دیگر پشتیبانی نمی شود) | |
| <frameset> | برای مجموعه ای از فریم ها (در Html5دیگر پشتیبانی نمی شود) | |
| <noframe> | برای آن دسته از کاربرانی که مرورگرهایشان فریم ها را پشتیبانی و به درستی نمایش نمی داد (در Html5دیگر پشتیبانی نمی شود) | |
| <iframe> | نشان دهنده یک فریم از نوع داخلی (inline) |
(5 تگ مربوط به عکس ها در HTML:
| <img> | برای نمایش عکس در صفحات وب | |
| <map> | برای نمایش نقشه در صفحات وب | |
| <area> | نشان دهنده یک ناحیه مشخص در نقشه سایت | |
| Html5 | <canvas> | جهت کشیدن گرافیک وب از طریق اسکریپت ها و کدنویسی |
| Html5 | <figcaption> | برای ایجاد یک caption (تیتر) برای المان های تگ <figure> |
| Html5 | <figure> | |
| Html5 | <picture> | مشخص کننده یک Container برای چندین عکس |
6) Audio/Video :
| <audio> | جهت اجرای صدا در سایت | |
| <source> | جهت اجرای چندین منبع مالتی مدیا در سایت برای المان های مدیا (شامل <audio> ، <video> و <picture> ) | |
| <track> | جهت نمایش متن Track ها برای المان های media (شامل <video> و <audio>) | |
| <video> | جهت نمایش ویدئو و یا فیلم در سایت |
7) لینک ها:
| <a> | جهت گذاشتن لینک در سایت (Hyperlink) | |
| <link> | جهت ارتباط دادن یک سند به یک سورس خارجی (معمولا جهت لینک دادن به فایل های css بکار می رود) | |
| <nav> | جهت گذاشتن لینک های navigation بکار می رود |
8) لیست ها:
| <ul> | برای ایجاد لیست های نامرتب (مخفف Unordred List) | |
| <ol> | برای ایجاد لیست های مرتب (مخفف Ordred List) | |
| <li> | برای مشخص کردن آیتم های یک لیست | |
| <dir> | نشان دهنده یک لیست Directory. (در Html5دیگر پشتیبانی نمی شود) بجای آن از <ul> استفاده کنید | |
| <dl> | مخفف description list | |
| <dt> | مخفف description term | |
| <dd> | مخفف description description (نشان دهنده یک توضیح برای یک عنوان در لیست توضیحات است) | |
| <menu> | نشان دهنده یک لیست/ منو از دستورات است | |
| Html5 | <menuitem> | نشاندهنده یک آیتم دستور/منو است که کاربر می تواند از منوی Pop-up انتخاب کند. |
9) جدولها:
| <table> | جهت نمایش یک جدول | |
| <caption> | جهت نمایش عنوان های یک جدول | |
| <th> | جهت نمایش خانه های Header در یک جدول | |
| <tr> | نشان دهنده یک مسیر خطی (row) در یک جدول | |
| <td> | نشان دهنده یک خانه (cell) در یک جدول | |
| <thead> | جهت گروه بندی محتوای Header در جدول | |
| <tbody> | جهت گروه بندی محتوای بدنه (body) در جدول | |
| <tfoot> | جهت گروه بندی محتوای پایین (footer) جدول | |
| <col> | جهت تعیین مشخصات یک ستون برای هر یک از المان های <colgroup> | |
| <colgroup> | نشان دهنده یک گروه شامل یک یا چند ستون در یک جدول جهت فرمت بندی |
10) Style ها و Semantic ها: (خصوصیات و دستورات)
| <style> | جهت اطلاعات Style (ویژگی ها یا خصوصیات) یک سند | |
| <div> | جهت قسمت بندی یک سند به بخش های کوچک تر | |
| <span> | مشابه تگ <div> است ولی بیشتر برای تخصیص ویژگی ها به کلمات و یا جمله های متن ها بکار می رود | |
| Html5 | <header> | تگی که برای جداسازی بخش های بالای سایت (Header) بکار می رود |
| Html5 | <footer> | تگی که برای جداسازی بخش های پایین سایت (Footer) بکار می رود |
| Html5 | <main> | جهت نشان دادن محتوای اصلی یک سند بکار می رود |
| Html5 | <section> | جهت بخش بندی یک سند بکار می رود |
| Html5 | <article> | جهت نشان دادن یک مقاله (یا یک محتوا) |
| Html5 | <aside> | مشخص کننده یک بخش خاصی از محتوای صفحه |
| Html5 | <details> | نشان دهنده جزئیات اضافی که کاربر می تواند آنها را اضافه و یا کم کند |
| Html5 | <dialog> | جهت نشان دادن یک پنجره و یا جعبه dialog |
| Html5 | <summary> | جهت یک heading قابل دیدن، برای یک المان <detail> |
| Html5 | <data> | محتوای داده شده را به یک ترجمه قابل خواندن توسط کامپیوتر ، لینک می کند |
11) اطلاعات Meta :
| <head> | نشان دهنده اطلاعاتی درباره آن سند است | |
| <meta> | نشان دهنده اطلاعات meta data درباره آن سند Html است | |
| <base> | مشخص کننده لینک URL/هدف اصلی تمام UrL ها در یک سند | |
| <basefont> | مشخص کننده نوع رنگ ، سایز و فونت پیش فرض برای کلمات متن. (در Html5دیگر پشتیبانی نمی شود) |
12) برنامه نویسی HTML:
| <script> | نشان دهنده اسکریپت های سمت کلاینت | |
| <no script> | یک محتوای جایگزین را مشخص می کند که به کامپیوترهای کلاینت هایی که از script ها پشتیبانی نمی کنند، بصورت جایگزین نشان دهد. | |
| <applet> | نشان دهنده یک <applet> است. (در Html5دیگر پشتیبانی نمی شود) | |
| Html5 | <embed> | نشان دهنده یک container برای یک اپلیکیشن خارجی (غیر Html) |
| <object> | نشان دهنده یک شیء قرارداده شده | |
| <param> | نشان دهنده پارامترها برای یک شیء |
توجه:
تگ هایی که در کنار آنها Html5 نوشته شده، در این نسخه اضافه و استاندارد شده اند. تگ های قرمز رنگ نیز در نسخه های قبلی Html استفاده می شدند ولی در نسخه Html5 دیگر استاندارد نیستند و استفاده از آنها توصیه نمی شود.
نظرات کاربران
اگر اطلاعات یا دیدگاهی در مورد مطالب این صفحه دارید، لطفا با ما و کاربران دیگر به اشتراک بگذارید