لیست انواع تگ HTML

  • نویسنده : امید ابوالحسنی
  • زمان مطالعه : 8 دقیقه
  • تاریخ انتشار : 1400/05/30
لیست انواع تگ HTML

درک هر تگ HTML یک مرحله بسیار مهم برای پیاده سازی کدهای HTML است. این مطلب به عنوان مرجعی برای تگ‌های استاندارد HTML و نحوه استفاده از آنها برای شما است که هر زمان اراده کنید می‌توانید تگ مورد نظر خود را از آن برداشته و داخل کدهای خود بگذارید.

تگ HTML چیست؟

به زبان ساده تگ‌های HTML دستورالعمل‌های ساده ای هستند که به مرورگر وب نحوه قالب بندی متن را توضیح می‌دهند. به عبارت دیگر، HTML  زبان صفحات وب است.

صفحات وب چگونه تگ‌های HTML را می‌خوانند؟

سرورها کد HTML را برای درک و ارائه محتوا می‌خوانند. HTML را از بالا به پایین درست مانند نحوه خواندن این مطلب می‌خواند. برای قالب بندی محتوا می‌توانید از هر چند تگی که دوست دارید استفاده کنید. با این حال، چند تگ و قوانین ضروری HTML وجود دارد که باید آنها را جدی بگیرید.

یک تگ HTML باید شامل سه قسمت باشد:

  • تگ باز: که با علامت <> شروع می‌شود.
  • محتوا: دستورالعمل‌های کوتاه در مورد نحوه نمایش عنصر روی صفحه
  • تگ بسته: که با علامت </> پایان می‌یابد.

در نظر داشته باشید که برخی از تگ‌های HTML می‌توانند خود بسته شوند. این بدان معناست که تگ HTML نیازی به بستن با </> ندارد. شما معمولاً از تگ‌های بسته برای متادیتاها یا خطوط استفاده می‌کنید.

تفاوت بین ویژگی‌ها (Attributes) و تگ‌های HTML چیست؟

اگرچه این مطلب تماما در مورد تگ‌های HTML است، اما مهم است که تفاوت بین تگ‌ها، عناصر و ویژگی‌های HTML را بدانید. عنصر HTML یک مورد در صفحه و بخشی از محتوای صفحه وب است. یک تگ HTML بر نحوه ظاهر شدن یک عنصر HTML تأثیر می‌گذارد. در واقع یک ویژگی یا همان اتربیوت HTML ویژگی‌های آن عنصر را توصیف می‌کند.

در ادامه نحوه عملکرد عناصر، تگ‌ها و ویژگی‌ها با هم شرح داده شده است:

  • تگ‌های HTML حاوی دستورالعمل‌هایی برای نمایش عنصر روی صفحه هستند. آنها با < شروع می‌شوند و با a> خاتمه می‌یابند و محتوای عنصر را دنبال می‌کنند. برای مثال: (e.g <b> Bold Tag </b>)
  • عناصر HTML محتوای درون صفحه ای هستند که درون تگ‌ها قرار گرفته اند. برای مثال: (<b> Bold Tag </b>)
  • ویژگیهای HTML اطلاعات بیشتری در مورد عناصر HTML ارائه می‌دهد و در داخل تگ HTML ظاهر می‌شود (به عنوان مثال:  (e.g. <html lang=”en-US”>).
نوعتگ HTMLعناصر HTMLHTML Attributes
Containsدستورالعمل نحوه نمایش عنصر روی صفحهمحتوای روی صفحه نمایش داده می شوداطلاعات اضافی در مورد عناصر روی صفحه
Appearanceبا <شروع می شود و با> خاتمه می یابددر برچسب HTML قرار داده شده استقبل از هر عنصری در برچسب قرار می‌گیرد

نمونه‌هایی از تگ‌های HTML

<p> Paragraph Tag </p>

این تگ برای متن روی صفحه است. این تگ هر متنی را بین تگ <p> باز و بسته </p> به عنوان پاراگراف استاندارد یا متن اصلی قالب بندی می‌کند.

<h2> Heading Tag </h2>

این تگ برای هدینگ یا تیتر هر صفحه است. با استفاده از این تگ، هر متنی بین تگ <h2> باز و بسته </h2> به عنوان h2 (نوعی زیر عنوان) دسته‌بندی می‌شود.

<b> Bold Tag </b>

این تگ برای بولد کردن یا پررنگ کردن قسمتی از متن صفحه است. این تگ هر متنی بین تگ <b> باز و بسته </b> را بصورت پررنگ قالب بندی می‌کند.

<i> Italic Tag </i>

این تگ برای ایتالیک کردن متن صفحه است. این تگ هر متنی بین تگ <i> باز و بسته </i> را به صورت ایتالیک قالب بندی می‌کند.

<u> Underline Tag</u>

این تگ برای خط کشیدن زیر متن انتخابی صفحه است. این تگ هر متنی را بین تگ <u> باز و بسته </u> به صورت زیرخط قالب بندی می‌کند.

رایج ترین تگ‌های HTML

تقریباً ۱۰۰ نوع مختلف تگ HTML وجود دارد که می‌توانید برای صفحات وب خود استفاده کنید. در ادامه لیستی از رایج ترین تگ‌های HTML قرار داده‌ایم:

تگنوع تگکارایی تگ
<p>تگ متنی htmlپاراگراف
<h1>تگ متنی htmlتیتر ۱
<h2>تگ متنی htmlتیتر ۲
<h3>تگ متنی htmlتیتر ۳
<h4>تگ متنی htmlتیتر ۴
<h5>تگ متنی htmlتیتر ۵
<h6>تگ متنی htmlتیتر ۶
<strong>تگ متنی htmlبولد یا استرانگ
<em>تگ متنی htmlتاکید
<abbr>تگ متنی htmlاختصار
<address>تگ متنی htmlاطلاعات تماس یا آدرس
<bdo>تگ متنی htmlنادیده گرفتن متن
<blockquote>تگ متنی htmlنقل قول از منبع دیگر
<cite>تگ متنی htmlعنوان اثر ، کتاب ، وب سایت
<q>تگ متنی htmlنقل قول داخلی
<code>تگ متنی htmlنمایش بخشی از کد برنامه نویسی
<ins>تگ متنی htmlمتن درج شده
<del>تگ متنی htmlمتن حذف شده از متن
<dfn>تگ متنی htmlاصطلاح تعریف شده در یک جمله/عبارت
<kbd>تگ متنی htmlورودی صفحه کلید یا کیبورد
<pre>تگ متنی htmlمتن پیش فرمت
<samp>تگ متنی htmlنمونه خروجی یک برنامه کامپیوتری
<var>تگ متنی htmlنام متغیر مورد استفاده در زمینه ریاضی یا برنامه نویسی
<br>تگ متنی htmlفاصله یک خطی
<div>تگ متنی htmlتقسیم بندی یا فاصله
<a>تگ لینک htmlانکرتکست تگ برای یک لینک
<base>تگ لینک htmlیک url برای همه urlها
<img>تگ عکس و آبجکت htmlعکس
<area>تگ عکس و آبجکت htmlمحدوده عکس در مپ
<map>تگ عکس و آبجکت htmlعکس نقشه
<param>تگ عکس و آبجکت htmlپارامتر برای عنصر <Object>
<object>تگ عکس و آبجکت htmlقراردادن یک شیء
<ul>تگ لیست htmlلیست نامرتب
<ol>تگ لیست htmlلیست مرتب
<li>تگ لیست htmlلیست
<dl>تگ لیست htmlلیست توضیحات
<dt>تگ لیست htmlعبارتی در لیست توضیحات
<dd>تگ لیست htmlتعریف/شرح اصطلاح در فهرست توضیحات

چگونه تگ‌های HTML سایت خود را بررسی کنید

اگر در حال حاضر تگ‌های HTML در صفحات وب خود دارید و می‌خواهید بررسی کنید که آیا آنها به درستی استفاده می‌شوند یا خیر، می‌توانید این کار را با مشاهده HTML صفحه خود انجام دهید. برای انجام این کار، تنها چیزی که نیاز دارید مرورگر وب شما است.

برای مشاهده HTML صفحه وب خود، باید:

  • در صفحه وب خود در Google Chrome راست کلیک کنید.
  • روی ‘inspect’ کلیک کنید.
  • کد HTML را در یک کادر در کنار یا پایین صفحه خود مشاهده خواهید کرد.
  • از Ctrl + F برای پیدا کردن تگ‌ها یا عناصر خاص مورد نظر خود استفاده کنید.

برای بررسی اینکه آیا وب سایت شما از تگ‌های HTML به درستی استفاده می‌کند یا خیر، می‌توانید تک تک کدهای سایت خود را بررسی کرده و هر مورد که اضافی است را حذف کنید. ابزارهایی هستند که می‌توانند بررسی کنند که آیا تگ‌ها و ویژگی‌های اصلی HTML شما صحیح هستند یا خیر.

پرسش و پاسخ تکمیلی

سفارش فوری تولید محتوا

تعداد کلمه و مقاله را وارد کنید تا سفارش شما محاسبه شود

درصد تخفیف : 0%
قیمت هر مقاله0 تومان
قیمت کل0 تومان
قیمت با تخفیف0 تومان
پرداخت

با ما گفتگو کنید