جلسه ی سوم : تگ چیست؟

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

تگ

همانطور که در آموزش های قبلی مشاهده نمودید ما زبان HTML را به ستون ها و زیر ساخت های یک ساختمان تشبیه کردیم. حال شاید برای شما این سوال به وجود آید که چگونه می توانیم یک تگ را در یک فایل HTML شناسایی نماییم.(به طور کلی ویژگی یک تگ چیست) در آموزش قبل گفیم که زبان HTML یک زبان نشانه گذاری است ، اما در مورد نشانه گذار های آن چیزی نگفتیم .

تگ ها کار نشانه گذاری در زبان HTML را انجام می دهند ، تگ ها قسمت های مختلف سایت را مشخص نموده و به طور کلی بخش های اصلی سایت را از هم جدا می کنند . معمولا تگ ها از دو قسمت تشکیل می شوند که قسمت اول شروع یا باز کننده ی تگ و قسمت دوم پایان یا تمام کننده ی تگ می باشد ( البته تگ ها انواع مختلفی دارند که در ادامه ی همین پست به توضیح آن ها می پردازیم ) .

تگ ها کلمات خاصی هستند که در میان دو علامت باز و بسته قرار می گیرند ، برای این که متوجه شویم تگ مورد نظر ما در حال باز شدن یا بسته شدن می باشد کافیست به قبل اسم تگ نگاه کنیم اگر قبل از اسم تگ ، علامت اسلش ( / ) وجود داشت یعنی تگ در حال بسته شدن می باشد در غیر این صورت تگ در حال باز شدن می باشد . حال برای فهم بیشتر مطلب به مثال زیر توجه کنید:

<tag></tag>

نکته : تگ ها کلمات خاص و از پیش تعیین شده ای هستند و نمی توانیم از هر کلمه یا حرف به عنوان یک تگ استفاده نماییم.

انواع تگ

تگ ها به صورت کلی به سه دسته تقسیم می شوند.

دسته ی اول

تگ هایی هستند که به صورت تگ های باز و بسته می باشند ، یعنی در مکانی ما آن تگ را باز نموده و در مکانی دیگر آن تگ را می بندیم برای مثال:

<tag></tag>

نکته: معمولا اکثر تگ هایی که ما در HTML ایجاد می کنیم از نوع تگ های باز و بسته می باشند.

دسته ی دوم

تگ هایی می باشند که در داخل خود تگ با علامت ( / ) بسته می شوند . برای مثال:

<tag.../>

دسته ی سوم

این دسته تگ هایی می باشند که به صورت تکی می آیند و نیازی به باز یا بسته نمودن تگ نیست ، به طور کلی به این تگ ها تگ یکتا می گویند . برای مثال:

<tag>

تگ های اصلی

در میان تگ هایی بالا تگ هایی وجود دارند که وجود آن ها ضروری می باشد ، یعنی جز مواد و مصالح مورد نیاز برای راه اندازی وب سایت هستند . تعدادی از این تگ ها را تگ های اصلی می نامند که عبارتند از :

<html>...</html>
<head>...</head>
<body>...</body>
<meta>
<title>...</title>

ویژگی های تگ ها

تگ ها دارای ویژگی های متفاوتی هستند که به این ویژگی ها attribute می گویند ، هر ویژگی دارای یک نام (Name) و یک مقدار (value) می‌باشد.  به طور کلی ویژگی های تگ ها به دو دسته تقسیم می شود که عبارتند از :

  1. ویژگی های عمومی
  2. ویژگی های خصوصی

ویژگی های عمومی

ویژگی های عمومی خاصیت هایی هستند که برای تمامی تگ ها استفاده می شوند و محدودیتی ندارند برای مثال ویژگی کلاس دادن به تگ ها که در بالای این آموزش به آن اشاره نموده ایم .

ویژگی های خصوصی

ویژگی های خصوصی خاصیت هایی هستند که برای یک تگ خاص استفاده می شود برای مثال در زبان نشانه گذاری HTML برای ایجاد یک دکمه از یک تگ به نام input استفاده می کنیم که جز تگ های دسته ی سوم می باشد . در این تگ از یک ویژگی (attribute) به نام type استفاده می کنیم و آن را بر روی button قرار می دهیم . ( فک کنم متوجه نشدید 😐 اشکالی نداره به عکس زیر نگاه کنید متوجه می شوید 😉  )

نکته : در مورد تگ input توضیحات بیشتری ارائه خواهیم کرد.

ویژگی تگ ها

نحوه ی کلاس دادن به تگ های HTML

تگ ها خود دارای ویژگی های خاصی می باشند اما گاهی این ویژگی ها کافی نیست و نیازمندیم که از ویژگی های دیگر در کنار خاصیت های تگ ها استفاده شود به همین علت به تگ ها کلاس می دهیم . ( نکته: مبحث کلاس ها و نحوه ی استفاده از آن ها در آموزش بعدی در بخش CSS کامل توضیح داده شده است ) برای این که بتوانیم به یک تگ کلاس بدهیم کافیست که آن تگ را نوشته و نام کلاس را در آن قرار دهیم ، برای فهم بیشتر این موضوع به مثال زیر توجه نمایید .


<tag class="نام کلاس">...</tag>


 

 

 

چکیده ی مطلب

  1. ما برای ساخت فایل HTML به تگ ها احتیاج داریم .
  2. تگ ها از لحاظ باز و بسته شدن سه دسته می باشند .
  3. معمولا بیشتر تگ ها به صورت جفتی یا دوتایی باز و بسته می شوند .
  4. تگ هایی مانند html ، body ، header ، meta و title تگ های اصلی سایت می باشند.
  5. برای بهره برداری بهتر از تگ های HTML و کم نمودن حجم کد از یک راهکار به نام کلاس دادن استفاده می کنیم.
  6. تگ ها دارای ویژگی های متفاوت (attribute ) می باشند که هر یک از این ویژگی دارای یک نام و یک مقدار می باشد .
  7. ویژگی تگ ها به دو دسته ی عمومی و خصوصی تقسیم می شوند .
  8. ویژگی عمومی برای همه ی تگ ها می باشد .
  9. ویژگی خصوصی تگ ها مخصوص خود آن ها می باشد .

 

سخن پایانی

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

 

ابوالفضل کلهری

فعال در زمینه های ui و ux و طراحی وب سایت مسلط به زبان های نشانه گذاری HTML و CSS و همچنین در زمینه ی آموزش زبان های HTML و CSS نیز فعالیت دارم . امیدوارم با آموزش هایی که در این سایت قرار می دهم موجب پیشرفت شما عزیزان باشم.

دیدگاه ها
  • قبل از ارسال دیدگاه خود قوانین بخش دیدگاه ها را مطالعه کنید. ارسال دیدگاه به معنی پذیرش این قوانین است. قوانین بخش دیدگاه ها