تگ ها را می توان به عنوان دستورالعمل هایی تعریف کرد که مستقیماً در متن یک سند HTML جاسازی می شوند. انواع تگ های مورد استفاده در سند HTML وظیفه دارند به مرورگر وب بگویند که به جای نمایش متن، کاری انجام دهد (دستورالعمل را دنبال کند).
در یک سند HTML، همه نام تگ ها از سایر متن های ساده متمایز می شوند. نام تگ ها در بین پرانتزهای زاویه ای یا علامت "کمتر از" و "بزرگتر از"، (<) و (>) قرار می گیرند.
3 نوع اصلی تگ در HTML
یک سند HTML با استفاده از انواع مختلف تگ ایجاد می شود. تگ های HTML را می توان بر اساس متفاوت تعریف و تقسیم کرد. بیایید آنها را در قسمت های بعدی این مقاله ببینیم. ما تگ های HTML را بر اساس طبقه بندی های زیر تقسیم کرده ایم:
1. تگ های جفت شده و جفت نشده
در ادامه تگ های جفت شده و جفت نشده در HTML به تفصیل با کمک مثال توضیح داده شده است.
تگ های جفت شده
یک تگ HTML زمانی به عنوان تگ جفتی شناخته می شود که تگ از یک تگ باز و یک تگ بسته به عنوان تگ همراه آن تشکیل شده باشد. یک تگ HTML Paired با یک تگ باز شروع می شود: نام تگ که در داخل براکت های زاویه قرار دارد. به عنوان مثال، یک تگ باز کردن پاراگراف به صورت "<p>" نوشته می شود. محتوا از تگ آغازین پیروی می کند که با یک تگ پایانی به پایان می رسد: نام تگ که با یک اسلش رو به جلو شروع می شود. به عنوان مثال، یک تگ پاراگراف پایانی به صورت "</p>" نوشته می شود. تگ اول را می توان به عنوان "تگ باز" و تگ دوم را می توان تگ بسته شدن نامید.
مثال 1:
<p> This text is a paragraph . </p>
مثال 2:
مثال دیگری از تگ های جفت شده، تگ های ایتالیک و/یا پررنگ است:
<i> <b> This is a bold and italicized text </b> </i>
تگ های جفت نشده
یک تگ HTML یک تگ جفت نشده نامیده می شود که تگ فقط یک تگ آغازین داشته باشد و تگ بسته یا تگ همراه نداشته باشد. تگ HTML Unpaired نیازی به تگ بسته شدن ندارد. یک تگ باز در این نوع کافی است. تگ‌های جفت‌نشده گاهی اوقات به عنوان تگ های مستقل یا تگ‌های منفرد نیز نام‌گذاری می‌شوند زیرا به تگ همراه نیاز ندارند.
مثال:
<p> This is a paragraph </p> <hr> <i> <b> This is a bold and italicized text </b> </i>
توجه: در اینجا، <hr> تگ جفت نشده ای است که برای ایجاد یک خط افقی استفاده می شود. در نسخه های قدیمی تر، ممکن است برچسب hr را به جای <hr> به صورت <hr/> ببینید. به این تگ ها Empty Tag نیز می گویند.
2. تگ های خود بسته شونده
تگ های خود بسته شونده آن دسته از تگ های HTML هستند که تگ شریک ندارند، که در آن اولین تگ تنها تگ ضروری است که برای قالب بندی معتبر است. اطلاعات اصلی و مهم در داخل عنصر به عنوان ویژگی آن موجود است. تگ تصویر یک نمونه کلاسیک از تگ خود بسته شدن است. بیایید آن را در عمل در زیر ببینیم:
مثال:
<img src="a.jpg" alt="This is an alternate text">
توجه: در نسخه‌های قدیمی‌تر، تگ‌های خود بسته‌شونده از علامت «/» قبل از پایان بسته می‌شوند، همانطور که در زیر نوشته شده است:
</ img src="a.jpg" alt="This is an alternate text">
3. تگ های مبتنی بر ابزار
تگ های HTML را می توان به طور گسترده ای بر اساس کاربردشان، یعنی بر اساس هدفی که به کار می برند، متمایز کرد. ما می توانیم آنها را اساساً به سه دسته تقسیم کنیم که در زیر مورد بحث قرار می گیرد:
تگ های قالب بندی
تگ‌های HTML که در قالب‌بندی متون به ما کمک می‌کنند مانند اندازه متن، سبک‌های فونت، پررنگ کردن متن و غیره. این کار با استفاده از برچسب‌هایی مانند <font>، <b>، <u> و غیره انجام می‌شود. جداول، تگ‌ها، تقسیم‌بندی‌ها و span نیز آن دسته از تگ‌هایی هستند که به فرمت یک صفحه وب یا سند و تنظیم طرح‌بندی صفحه کمک می‌کنند. در زیر یک برنامه کوچک با استفاده از تقسیم بندی برای قالب بندی صفحه به همراه برخی تگ های قالب بندی دیگر وجود دارد.
<body>
<div class="container">
<div class="row">
<div class="col-25">
<label for="email"><b>Name</b></label>
</div>
<div class="col-35">
<input type="text" placeholder="First" name="fname" required>
</div>
<div class="col-35">
<input type="text" placeholder="Last" name="lname" required>
</div>
</div>
</div>
</body>
تگ های ساختار
تگ های HTML که به ساختار سند HTML کمک می کنند، تگ های ساختار نامیده می شوند. Description, head, html, title, body, و غیره. گروهی از تگ های ساختار صفحه را تشکیل می دهند. تگ های ساختار فقط به ایجاد یا تشکیل صفحه اصلی html از ریشه کمک می کنند. یعنی در قالب بندی متون تاثیری ندارند. بنابراین یک برنامه اولیه HTML گروه اصلی تگ های ساختاری است:
مثال:
<!doctype html> <html> <head> <meta charset="utf-8"> <title>Types of Tags Demo</title> </head> <body> <p> This is a paragraph </p> <i><b> This is a bold and italicized text </b></i> </body> </html>
تگ های کنترل
دسته دیگری از تگ ها که می‌توان ایجاد کرد «تگ های کنترل» است. تگ های اسکریپت، دکمه‌های رادیویی یا چک باکس‌ها، تگ‌های Form و غیره، تگ‌های کنترل را تشکیل می‌دهند. اینها برچسب هایی هستند که در مدیریت محتوا یا مدیریت اسکریپت ها یا کتابخانه های خارجی استفاده می شوند. تمام تگ‌های فرم، لیست‌های کشویی، جعبه‌های متن ورودی و غیره در تعامل با بازدیدکننده یا کاربر استفاده می‌شوند.
تمایز بالا از تگ های HTML بر اساس نوع تگ ها و کاربرد آنها است. همچنین می‌توان تگ‌های HTML را بر اساس دسته‌بندی‌های اساسی مانند تگ‌های ریشه اصلی HTML، برچسب‌های قالب‌بندی، تگ‌های صوتی و تصویری، تگ‌های فرم و ورودی، تگ‌های فریم، برچسب‌های پیوند، برچسب‌های فهرست، تگ‌های جدول، تگ‌های سبک، تگ‌های متا و غیره تقسیم کرد. .
منبع: educba.com
