لیست کامل تگ های HTML
دسته بندی : آموزش HTML سطح مقاله : متوسط زمان مطالعه : 15 دقیقه آخرین بروز رسانی: 13 شهریور 1398لیست کامل تگ های HTML در این مقاله از سایت آموزشی دویکس برای شما جمع آوری شدهاند؛ تگ های اچ تی ام ال که برای نشانه گذاری در صفحات وب استفاده میشوند به صورت مستقیم در مبحث سئو تاثیرگذار هستند و آشنایی با کاربرد هر کدام کاملاً ضروری است.
چرا به HTML زبان نشانه گذاری میگویند؟
مباحث زیادی در مورد اینکه آیا HTML زبان برنامه نویسی هست یا نه وجود دارد و مشاجرههای زیادی هم میان برنامه نویسان و افرادی که از HTML و CSS استفاده میکنند وجود دارد.
کلمه HTML مخفف عبارت Hyper Text Markup Language است؛ همانطور که در متن اصلی میبینید از لغت Markup به معنی نشانه گذاری استفاده شده و این واضحترین دلیل برای اثابت زبان برنامه نویسی نبودن HTML است!
بجز معنا و مفهومی که مرور کردیم باید گفت که HTML از ویژگیها و قواعد زبانهای برنامه نویسی پیروی نمیکند؛ مثلاً در زبان HTML :
- نمیتوانید از توابع (function) استفاده کنید
- نمیتوانید از شرطهای if و else استفاده کنید
- نمیتوانید متغیر بسازید و به متغیرها مقدار دهید
- نمیتوانید از حلقههای while و for و… استفاده کنید
- نمیتوانید از برنامه نویسی به روش شی گرا لذت ببرید
کاربرد تگ های HTML
هر تگ HTML کاربردی منحصر بفرد و معنای خاص خود را دارد که در ادامه به معرفی مختصر این تگها میپردازیم.
لیست کامل تگ های HTML
تگ | توضیحات |
<–…–!> | کامنت گذاشتن در HTML؛ با این تگ میتوان توضیحاتی به سند اضافه کرد که توسط مرورگر نادیده گرفته میشوند. |
<!DOCTYPE> | تعیین کننده نوع سند و نسخه HTML است؛ این تگ به مرورگر اطلاع میدهد که نسخهای از HTML استاندارد که صفحه وب از آن استفاده میکند، چگونه باید تفسیر و نمایش شود. |
<a> | برای ایجاد لینک یا پیوند در صفحات وب استفاده میشود. |
<abbr> | برای نمایش کلمات یا عباراتی که به صورت مخفف هستند به کار میرود. |
<acronym> | برای تعریف یک کلمه یا عبارت مخفف استفاده میشود اما در HTML 5 منسوخ شده و به جای آن از تگ <abbr> استفاده میشود. |
<address> | برای نشان دادن اطلاعات تماس یا اطلاعات آدرس یک شخص یا سازمان در یک صفحه وب استفاده میشود. |
<applet> | برای جاسازی اپلت جاوا در یک سند HTML مورد استفاده قرار میگیرد اما در HTML 5 منسوخ شده و به جای آن از تگ <object> یا <embed> استفاده میشود. |
<area> | برای تعریف یک ناحیه قابل کلیک در نقشه استفاده میشود؛ این تگ در ارتباط با تگ <map> بهکار میرود. |
<article> | برای تعریف یک مطلب مستقل مثل مقاله، پست وبلاگی یا محتوای مستقل دیگر به کار میرود. |
<aside> | برای نشان دادن محتوای فرعی یا مرتبط با محتوای اصلی صفحه وب استفاده میشود. |
<audio> | برای قرار دادن و نمایش فایلهای صوتی در صفحات وب به کار میرود. |
<b> | متن را برجسته (bold) میکند. |
<base> | این تگ تعیین میکند که تمام پیوندها یا لینکهای موجود در صفحه به چه آدرسی باید ارجاع دهند. |
<basefont> | برای تعیین فونت پایه یا اندازه فونت برای متن در یک صفحه وب استفاده میشود اما در HTML 5 منسوخ شده است. |
<bdi> | این تگ برای جلوگیری از تغییر جهت متن از چپ به راست یا برعکس در متونی با جهت مختلف مورد استفاده قرار میگیرد. |
<bdo> | این تگ برای اعمال جهت نوشتاری خاص به متن استفاده میشود، به طوری که اگر یک زبان راست به چپ (مانند فارسی یا عربی) یا چپ به راست (مانند انگلیسی) دارید، میتوانید جهت نوشتاری متن را با آن تغییر دهید. |
<big> | این تگ برای افزایش اندازه متن مورد استفاده قرار میگیرد اما در HTML 5 منسوخ شده است. |
<blockquote> | این تگ به مرورگر اطلاع میدهد که یک قسمت از متن یا نقل قول از یک منبع دیگر مثلاً کتاب، مقاله یا وب سایت دیگری است. |
<body> | برای تعیین بخش بدنه یا محتوای اصلی یک صفحه وب استفاده میشود؛ این تگ شامل تمام محتوا و عناصری است که در صفحه وب قرار دارند و به طور مستقیم بر روی صفحه نمایش داده میشود. |
<br> | این تگ برای ایجاد فاصله در میان متنها یا عناصر مختلف صفحه استفاده میشود. |
<button> | برای ایجاد یک دکمه قابل کلیک بر روی صفحه وب استفاده میشود (برای انجام یک عملیات، ارسال فرمها، اجرای اسکریپتها و دسترسی به عملکردهای دیگر JavaScript). |
<canvas> | برای ایجاد یک صفحهی قابل رسم و تغییرات گرافیکی در صفحه وب استفاده میشود؛ این تگ به توسعه دهندگان اجازه میدهد تا به کمک جاوا اسکریپت، تصاویر و گرافیکهای پویا را روی صفحه نمایش ایجاد کنند. |
<caption> | برای تعیین عنوان یک جدول مورد استفاده قرار میگیرد. |
<center> | برای وسط چین کردن محتوا در صفحه وب به کار میرود اما در HTML 5 منسوخ شده است. |
<cite> | برای نمایش ارجاعها به منابعی که برای اطلاعات یا نقل قولهای متن استفاده شدهاند به کار میرود. |
<code> | برای نشان دادن بخشی از متن که باید به عنوان کد برنامه نویسی نمایش داده شود به کار میرود. |
<col> | این تگ معمولاً درون تگ <colgroup> قرار میگیرد و از آن برای تعیین ویژگیهای ستونهای خاص یک جدول استفاده میشود. |
<colgroup> | این تگ برای ایجاد یک گروه از تگهای <col> به منظور اعمال ویژگیهای مشترک بر روی چند ستون جدول به کار میرود. |
<data> | اطلاعات عددی یا علائمی را که به طور پیش فرض مرتبط با یک مقدار داده هستند، تعریف میکند. |
<datalist> | برای تعریف یک لیست از گزینههایی که کاربر میتواند در فرم input از بین آنها انتخاب کند استفاده میشود. |
<dd> | تگ <dd> باید همراه با تگ <dt> که مخفف عبارت “definition term” است، به کار برده شود. تگ <dd> برای تعریف محتوای مربوط به یک تگ <dt> به کار میرود. |
<del> | برای نمایش متن یا بخشی از متن که حذف شده است به کار میرود؛ به عبارتی دیگر روی قسمتی از متن که درون این تگ قرار دارد خط کشیده میشود تا به عنوان متن حذف شده در نظر گرفته شود. |
<details> | این تگ محتوای پنهانی یا اطلاعاتی که در ابتدا قابل مشاهده نیستند را ایجاد میکند تا زمانی که این اطلاعات با کلیک بر روی یک عنصر مثلاً یک دکمه، نمایش داده شوند. |
<dfn> | برای تعریف یک مفهوم یا نام علمی در متن به کار میرود. |
<dialog> | تگی است که با استفاده از آن میتوان یک پنجره بازشو (پنجره پاپ آپ) ایجاد کرد. |
<dir> | برای ایجاد یک لیست نامرتب به کار میرود اما در HTML 5 منسوخ شده است و به جای آن از تگ <ul> یا <ol> استفاده میشود. |
<div> | برای ایجاد یک بلاک یا بخشی از محتوا استفاده میشود؛ این تگ برای گروه بندی و سازماندهی عناصر HTML به کار میرود. |
<dl> | این تگ برای ساختار دهی عنوانها <dt> و توضیحات <dd> یک جدول مورد استفاده قرار میگیرد. |
<dt> | برای تعریف عنوان یک آیتم از جدول به کار میرود. |
<em> | برای تأکید و نمایش متن به صورت ویژه و مهم استفاده میشود. |
<embed> | برای درج یک عنصر چند رسانهای، مانند فایلهای صوتی، ویدیویی یا اشیاء جاوا اسکریپت در صفحه وب استفاده میشود؛ این تگ قدیمی است و استفاده از تگهای بهروزتر مانند تگ <video> و <audio> توصیه میشود. |
<fieldset> | برای گروهبندی عناصر فرم (form) استفاده میشود. |
<figcaption> | برای ایجاد عنوان یا توضیحات برای محتوای یک عنصر، مانند تصویر درون یک تگ <figure> استفاده میشود. |
<figure> | برای قرار دادن یک محتوای مستقل، مانند تصویر، ویدیو، نمودار یا یک محتوای چندرسانهای دیگر در صفحه وب بهکار میرود. |
<font> | برای تغییر فونت، اندازه و رنگ متن به کار میرود اما در HTML 5 منسوخ شده است. |
<footer> | برای نشان دادن بخش پایانی یک صفحه وب به کار میرود. |
<form> | برای ایجاد یک فرم یا فضایی برای جمع آوری اطلاعات از کاربران در وب سایت استفاده میشود. |
<frame> | یک تگ قدیمی مربوط به فریمها (frames) برای ایجاد قسمتهای مختلف یک صفحه وب با امکان نمایش محتوا از منابع مختلف است اما توصیه میشود که دیگر از آن استفاده نکنید و از تکنولوژیهای به روزتر برای انجام این کار استفاده کنید. |
<frameset> | برای تعریف یک ستون بندی (layout) با استفاده از فریمها (frames) در یک صفحه وب مورد استفاده قرار میگیرد اما توصیه میشود که دیگر از آن استفاده نکنید و از تکنولوژیهای به روزتر برای انجام این کار استفاده کنید. |
<h1> to <h6> | برای ایجاد عناوین مختلف یک صفحه وب به کار میروند؛ هرکدام از این تگها مخصوص نمایش عناوین با سطوح اهمیت متفاوت هستند، به طوری که <h1> بیشترین اهمیت را نشان میدهد و <h6> کمترین. |
<head> | برای ایجاد بخش اصلی سند HTML و اضافه کردن اطلاعات متا، اطلاعات عنوان و لینکهای خارجی به صفحه وب مورد استفاده قرار میگیرد. |
<header> | این تگ برای قرار دادن المانهای مربوط به سربرگ یا بالای صفحه مانند لوگو، منو، عنوانها و موارد مشابه مورد استفاده قرار میگیرد. |
<hr> | برای ایجاد یک خط افقی بین محتواهای مختلف یک صفحه وب استفاده میشود. |
<html> | برای شروع یک سند HTML استفاده میشود؛ این تگ حاوی تمام محتویات یک صفحه وب است و به مرورگر اعلام میکند که متن درون آن یک سند HTML است. |
<i> | برای نمایش متن یا عناصری که باید به صورت مورب یا کج (italic) نمایش داده شوند، استفاده میشود البته بهتر است از تگ <em> که محتوا را علاوه بر تغییر استایل معنا دار میکند استفاده کنید. |
<iframe> | برای نمایش محتوای دیگری که از یک منبع خارجی مثل یک صفحه وب یا یک سند دیگر است، درون یک صفحه وب استفاده میشود. |
<img> | برای اضافه کردن یک تصویر در صفحه وب استفاده میشود. |
<input> | برای ایجاد یک فیلد ورودی یا محلی برای ورود اطلاعات توسط کاربر استفاده میشود. |
<ins> | این تگ برای نمایش متنی جدید یا محتوایی که به تازگی به یک سند اضافه شده به کار میرود. |
<kbd> | برای نمایش یک متن یا ورودی که باید از صفحه کلید وارد شود استفاده میشود. |
<label> | این تگ برای ایجاد یک برچسب یا توضیحات برای فیلدهای ورودی نظیر دکمهها، فیلدهای متنی و سایر عناصر ورودی مورد استفاده قرار میگیرد. |
<legend> | برای اضافه کردن یک عنوان یا توضیح برای یک گروه از عناصر در یک فرم (form) و همچنین برای گروه بندی المانهای فرم استفاده میشود؛ این تگ معمولاً درون تگ <fieldset> قرار میگیرد که یک گروه از فیلدهای فرم را تعریف میکند. |
<li> | برای ایجاد یک مورد یا یک آیتم در یک لیست مرتب <ol> یا نامرتب <ul> به کار میرود. |
<link> | برای ارتباط صفحات وب با فایلهای مربوطه مانند فایلهای CSS، فونتها، آیکونها و سایر منابع خارجی به کار میرود. |
<main> | برای تعیین بخش اصلی یک صفحه وب استفاده میشود؛ این تگ برای نشان دادن محتوای اصلی و مهم صفحه وب به کار میرود و باید فقط یکبار در هر صفحه استفاده شود. |
<map> | برای ایجاد یک نقشه تصویری (image map) استفاده میشود؛ این تگ برای ایجاد ناحیههای قابل کلیک روی یک تصویر و لینک دادن آنها به صفحات وب مختلف به کار میرود. |
<mark> | برای برجسته کردن یک قسمت مشخص از متن یا محتوا به صورتی که آن قسمت مشخص شود، استفاده میشود؛ این تگ به مرورگر اعلام میکند که متن داخل این تگ باید پر اهمیت، برجسته و مشخص نمایش داده شود. |
<meta> | برای تعیین اطلاعات متا یا متا دادههای یک صفحه وب استفاده میشود؛ این تگ اطلاعاتی که مربوط به صفحه وب هستند و اغلب برای موتورهای جستجو یا مرورگرها ارسال میشوند، فراهم میکند. |
<meter> | برای نمایش یک مقدار به صورت اندازه گیری یا متریک استفاده میشود؛ این تگ به کاربر امکان میدهد تا مقادیری که در یک محدوده خاص قرار دارند را مشاهده کند، مانند میزان پیشرفت، دما یا سایر مقادیر قابل اندازه گیری. |
<nav> | برای تعریف منوی اصلی صفحه استفاده میشود. |
<noframes> | برای ارائه متن برای مرورگرهایی که فریمها (frames) را پشتیبانی نمیکنند، به کار میرود. |
<noscript> | برای ارائه محتوای جایگزین به کاربرانی که اسکریپتهای جاوا اسکریپت را غیرفعال کردهاند، به کار میرود. |
<object> | این تگ امکان اضافه کردن و نمایش محتوای چندرسانهای (مانند صدا، ویدیو، فایل PDF و…) را فراهم میکند. |
<ol> | برای ایجاد یک لیست مرتب (لیست شماره دار) استفاده میشود. |
<optgroup> | برای گروه بندی و دسته بندی گزینههای یک لیست انتخابی (dropdown) در یک فرم (form) استفاده میشود. |
<option> | برای تعریف یک گزینه در یک فهرست انتخابی (dropdown) در یک فرم (form) استفاده میشود. |
<output> | این تگ برای نمایش خروجی یک عملیات محاسباتی یا اطلاعات مشابه به کار میرود. |
<p> | برای تعریف یک پاراگراف متن استفاده میشود. |
<param> | برای تعیین پارامترهای ورودی برای شیءهای جاسازی شده (embedded objects) استفاده میشود. |
<picture> | برای ایجاد تصویر با اندازههای مختلف وابسته به اندازه صفحه نمایش یا ویژگیهای دیگر استفاده میشود. |
<pre> | برای نمایش متن یا کد با حفظ فضای خالی، فواصل و ترتیبهای خطوط از قبل تعیین شده استفاده میشود. |
<progress> | این تگ به کار میرود تا نشان دهد که یک عملیات یا پردازش به چه مرحلهای از پیشرفت رسیده است. |
<q> | برای نقل قول کوتاه و درون متن استفاده میشود. |
<rp> | این تگ برای نمایش متن جایگزین برای مرورگرهایی که از تگهای Ruby (برای نمایش زبانهای آسیایی مانند ژاپنی و چینی) پشتیبانی نمیکنند، مفید است. |
<rt> | برای تعیین نوشتار زبانهای آسیایی مانند ژاپنی به کار میرود. |
<ruby> | این تگ معمولاً برای نمایش توضیحات یا ترجمه فونتی بر روی کلمات یا عبارات در زبانهای آسیایی مانند ژاپنی استفاده میشود. |
<s> | به عنوان یک تگ قدیمی برای نشان دادن متنی که باید از دید کاربران خارج شود یا به عبارت دیگر، برای نمایش متنی که دیگر اعتبار ندارد، به کار میرود. |
<samp> | این تگ معمولاً برای نمایش نمونههایی از خروجیهای برنامه نویسی، خروجی کدها یا دادههای محاسباتی استفاده میشود. |
<script> | برای تعریف و یا جاسازی کد اسکریپت (معمولاً جاوااسکریپت) به کار میرود. |
<section> | این تگ برای گروهبندی محتوا به صورت منطقی و مستقل از سایر بخشها استفاده میشود. |
<select> | برای ایجاد یک فهرست کشویی (یا منوی انتخاب) از گزینههای مختلف استفاده میشود؛ وقتی از <select> استفاده میشود، معمولاً با استفاده از تگهای <option> داخل آن، گزینههای مختلفی را که کاربر میتواند انتخاب کند، ارائه میدهیم. |
<small> | این تگ معمولاً برای نشان دادن متنی کوچکتر که ممکن است شامل توضیحات فرعی و اطلاعات تکمیلی باشد استفاده میشود. |
<source> | برای ارائه منابع چندگانه (فرمتهای مختلف ویدیو یا فایل صوتی) برای عناصری مانند تگ <video>یا <audio>استفاده میشود. این تگ به صورت تو در تو با عنصر اصلی ویدیو یا صدا قرار میگیرد و به مرورگر اطلاع میدهد که منبع محتوا از چندین فایل مختلف تهیه شده است و باید یکی از آنها برای پخش انتخاب شود. |
<span> | یک محفظه درون خطی بدون استایل پیش فرض است که برای علامت گذاری بخشی از یک متن استفاده میشود. |
<strike> | این تگ در گذشته برای خط کشی بر روی متن استفاده میشده اما در HTML 5 توصیه شده که از آن استفاده نکنید. |
<strong> | این تگ به مرورگر اطلاع میدهد که متن درون آن باید به عنوان یک متن مهم یا برجسته مورد توجه قرار گیرد. |
<style> | این تگ به طور معمول در بخش هدر (head) یک صفحه وب قرار میگیرد و از طریق آن میتوانیم قوانین CSS را برای استایل دهی به محتوای HTML صفحه تعیین کنیم. |
<sub> | برای نمایش متن به صورت زیرین (Subscript)، به معنای قرار گرفتن متن زیر متن اصلی به کار میرود؛ این تگ معمولاً برای نمایش ارقام فرمول یا توضیحات زیرنویس مورد استفاده قرار میگیرد. |
<summary> | برای تعریف یک عنوان برای یک عنصر <details> استفاده میشود؛ تگ <summary> به عنوان یک عنصر قابل کلیک در تگ <details> عمل میکند که وقتی کاربر بر روی آن کلیک میکند، محتوای داخلی که مخفی شده است را نمایش میدهد یا پنهان میکند. |
<sup> | برای نمایش متن به صورت بالانویس (Superscript)، به معنای قرار گرفتن متن بالاتر از خط اصلی، مانند توان در ریاضیات استفاده میشود. |
<svg> | SVG به عنوان یک فرمت تصویر برداری قابل مشاهده و ویرایش با استفاده از کد HTML است که با استفاده از این تگ امکان نمایش آن روی صفحه وب وجود دارد. |
<table> | برای ایجاد جدولها استفاده میشود، جدولها میتوانند شامل سطرها و ستونها باشند و اطلاعات را به شکل دسته بندی شده نمایش دهند. |
<tbody> | برای نشان دادن بخش مربوط به محتوای جدول به کار میرود؛ این تگ معمولاً جهت دسته بندی سطرهای مربوط به دادهها در یک جدول است. |
<td> | برای ایجاد یک سلول داده در یک جدول استفاده میشود؛ این تگ به معنای “Table Data” است و برای نمایش دادهها درون سلولهای جدول استفاده میشود. |
<template> | تگی است که با استفاده از آن میتوان یک محتوا را در یک صفحه وب قرار داد ولی از بارگذاری همزمان آن با بارگذاری صفحه و نمایش آن در مرورگرها جلوگیری کرد؛ محتوای این تگ باید به صورت دستی و معمولاً با استفاده از جاوااسکریپت به نمایش درآیند. |
<textarea> | برای ایجاد یک ناحیه متنی چند خطی برای ورود اطلاعات توسط کاربر به کار میرود. |
<tfoot> | این تگ برای قرار دادن المانهای مربوط به پایین جدول، مانند خلاصه دادهها یا اطلاعات پایانی، به کار میرود. |
<th> | این تگ به معنای “Table Header” است و برای نمایش سرستونها یا عناوین ستونهای جدول به کار میرود. |
<thead> | این تگ جهت گروه بندی سرستونها یا عناوین ستونهای جدول به کار میرود. |
<time> | برای نمایش و تعریف زمان یا تاریخ مربوط به متن یا محتوا استفاده میشود. |
<title> | برای تعیین عنوان صفحه وب استفاده میشود. |
<tr> | برای تعریف یک ردیف در یک جدول استفاده میشود، این تگ به معنای “Table Row” است و برای نمایش دادههای مختلف در یک سطر از جدول به کار میرود. |
<track> | این تگ به وبسایتها امکان میدهد تا اطلاعات زیرنویس، مانند زیرنویسهای متنی، ترجمهها یا دادههای دیگری که به محتوای ویدیو یا صدا مرتبط هستند را ارائه دهند. |
<tt> | این تگ برای ایجاد یک متن تله تایپ به کار میرود اما در HTML 5 منسوخ شده است و به جای آن از تگ <kbd> استفاده میشود. |
<u> | این تگ زیر متنی که داخل آن قرار بگیرد خط میکشد. |
<ul> | برای تعریف یک لیست نامرتب (Unordered List) استفاده میشود. |
<var> | برای نشان دادن یک متغیر (Variable) در متن استفاده میشود. |
<video> | برای اضافه کردن ویدیو به یک صفحه وب استفاده میشود. |
<wbr> | مخفف (Word Break) است و میتوان با آن رفتن متن به خطوط بعد را کنترل کرد. |
مقاله لیست کامل تگ های HTML را در اینجا به اتمام میرسانیم؛ اگر به آموزش رایگان CSS علاقه دارید میتوانید تمامی مقالات آموزش CSS را در دویکس دنبال کنید.
منبع: w3schools.com
این مقاله چقدر براتون مفید بود؟