مفهوم تگ در زبان HTML بررسی ساختار تگ در صفحه وب
در این مقاله از سایت آموزی قصد دارم، مفهوم تگ رو در زبان طراحی HTML براتون کامل شرح بدم.
اول باید بدونیم که تگ ها چه هستند؟ و چند نوع تگ داریم؟
در زبان طراحی HTML تگ ها برای کدنویسی المنت های مختلف کاربرد دارند.
دو نوع تگ در HTML داریم : ۱- تگ های باز (Opening Tag) و ۲- تگ های بسته (Closing Tag)
برخی المنت ها فقط دارای یک تگ باز هستند. یعنی فقط opening tag رو شامل می شوند.
اما برخی دیگر از elements (المنت ها) شامل هر دو تگ باز (Opening tag) و تگ بسته (Closing Tag) هستند.
حالا در مورد هر کدوم از انواع این تگ ها براتون توضیح میدم.
مفهوم تگ باز ( Opening Tag ):
در تصویر مقابل ، یک تگ باز هدینگ ۱ رو ملاحظه می کنید. که با h1 نشان داده می شه.
همه تگ های باز مثل همین تگ هدینگ شامل یک هشتک باز (>) ، اسم تگ و یک هشتک بسته (<) هستند.
اسم تگ همان HTML ELEMENT نام داره.
و همانطور که در تصویر ملاحظه می کنید زاویه های چپ و راست شروع و خاتمه تگ هستند.
مفهوم تگ بسته ( Closing Tag ):
همانطور که در شکل مقابل هم ملاحظه می کنید ، تگ بسته هدینگ ۱ دارای ۴ بخش است.
همه تگ های بسته (Closing Tags) شامل یک هشتک یا زاویه باز (>) ، یک علامت اسلش (forward slash) ، اسم تگ و یک هشتک یا زاویه بسته (<) هستند.
تفاوت تگ های بسته با تگ های باز در HTML تنها در اضافه شدن علامت forward slash (/) قبل از اسم تگ (HTML ELEMENT) می باشد.
حالا که با مفهوم تگ باز و تگ بسته در HTML آشنا شدید ، همانطور که در بالا اشاره کردم المنت ها در HTML دو دسته می شوند :
- تگ هایی که فقط به صورت یک تگ تنها یا Self-Closing Tags هستند.
- تگ هایی که دارای تگ باز و تگ بسته هستند و بین آنها میتوان محتوا نوشت.
در شکل مقابل یک نمونه تگ تکی Self-Closing Tag و یک نمونه تگ که دارای هر دو تگ باز و بسته می باشد را مشاهده می کنید.
نکته ۱ : در بین تگ های باز و بسته محتوا یا Content قرار میگیرد.
نکته ۲ : تگ های تکی ( Self-Closing Tags ) ، در داخل خود می توانند شامل خصوصیات ( Attributes ) شوند.
نکته ۳ : در برخی المنت هایی که شامل تگ باز و تگ بسته اند ممکن است، داخل تگ های باز خصوصیات ( Attributes ) قرار گیرد.
نکته ۴ : تگ بسته هیچ گونه خصوصیت و مقداری نمی گیرد و تنها به منزله نقطه پایانی تگ لحاظ می شود.
پیوندهای مهم و کاربردی
تگ های جدید HTML5 در سایت آموزی
صفات تگ های HTML در سایت آموزی
تگ های منسوخ شده HTML5 در سایت آموزی
