عنصر اچ‌تی‌ام‌ال

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

 مفاهیم 
 عناصر و تگ‌ها 
موقعیت یک عنصر از یک تگ شروع آغاز می‌شود و با یک تگ پایان، خاتمه می‌یابد. بسیاری از عناصر در یک سند اچ‌تی‌ام‌ال، اما نه همه آنها، از این قاعده پیروی می‌کنند که به صراحت در مشخصات اچ‌تی‌ام‌ال ۴٫۰۱ آمده‌است:

همچنین، توصیه‌نامه کنسرسیوم وب جهان‌گستر در نسخه دوم اچ‌تی‌ام‌ال ۵٫۱، به صراحت می‌گوید:

و:

 نگاه کلی 
 سینتکس 

در سینتکس اچ‌تی‌ام‌ال، بیشتر عناصر با یک تگِ شروع و یک تگِ پایان نوشته می‌شوند و محتوا در بین آن‌ها قرار دارد.

<تگ> ... محتوا ... <تگ/>

یک تگ اچ‌تی‌ام‌ال از یک نام عنصر که توسط پرانتز شکسته  <>  احاطه شده‌است، تشکیل می‌شود. یک تگ پایانی همچنین دارای یک اسلش، بعد از باز کردن براکت اول است تا آن را از تگِ شروع متمایز کند. به عنوان مثال، یک پاراگراف که با عنصر  نشان داده می‌شود، به صورت زیر نوشته می‌شود:
<p>...محتوای پاراگراف...</p>
اگرچه، همه عناصر در اچ‌تی‌ام‌ال، نیازی به تگ پایانی یا حتی تگ شروع ندارند. برخی از عناصر که اصطلاحاً عناصر تهی یا خالی یا حتی تگ غیرجفت نامیده می‌شوند، برچسب پایانی ندارند. یک مثال معمولی از این نوع عناصر، عنصر  است. رفتار یک عنصر خالی از پیش تعریف شده‌است و نمی‌تواند حاوی هیچ محتوا یا عناصر دیگری باشد. به عنوان مثال، این یک آدرس است که با تگ  نوشته شده:
<p>P. Sherman{{سخ}}42 Wallaby Way{{سخ}}Sydney</p>
هنگام استفاده از اکس‌اچ‌تی‌ام‌ال، لازم است همه عناصر، از جمله عناصر خالی، باز و سپس بسته شوند. این کار را می‌توان با قرار دادن یک تگ پایان بلافاصله بعد از تگ شروع انجام داد، اما در اچ‌تی‌ام‌ال ۵ چنین کاری مجاز نیست و منجر به ایجاد دو عنصر می‌شود. یک راه جایگزین برای آنکه تعیین کنیم در حال تعریف یک عنصر خالی هستیم و با هر دو زبان اکس‌اچ‌تی‌ام‌ال و اچ‌تی‌ام‌ال ۵ سازگار است، قرار دادن  / در انتهای تگ است (با علامت / در ابتدای بستن تگ یک عنصر اشتباه نشود).
<p>P. Sherman{{سخ}}42 Wallaby Way{{سخ}}Sydney</p>
خصلت‌ها یا صفت‌های اچ‌تی‌ام‌ال کلماتی هستند که رفتار و وضعیت عناصر را کنترل می‌کنند و در داخل تگ ابتدایی یا همان تگ شروع مشخص و تعریف می‌شوند. در مثال زیر، عنصر  برای کوتاه‌نویسی یک عبارت به کار برده شده و در تگ آغازین آن، با کمک صفت title شکل کامل عبارت تعریف شده‌است.
<abbr title="HyperText Markup Language">HTML</abbr>

به‌طور غیررسمی، گاهی اوقات به عناصر اچ‌تی‌ام‌ال، «تگ» گفته می‌شود (که نمونه‌ای از بخش‌گویی است)، اگرچه بسیاری از آنها اصطلاح تگ را صرفاً با اشاره به نشانه‌گذاری که شروع و پایان یک عنصر را مشخص می‌کند، ترجیح می‌دهند.

نام عناصر (و صفت‌ها) ممکن است با ترکیبی از حروف بزرگ یا کوچک در اچ‌تی‌ام‌ال نوشته شود و به بزرگی و کوچکی حروف حساس نیستند، بنابراین  با  تفاوتی ندارد، اما در اکس‌اچ‌تی‌ام‌ال، حروف باید کوچک باشد.XHTML 1.0 §4.2 تا اچ‌تی‌ام‌ال ۴، حروف بزرگ متعارف بود و در مشخصات اچ‌تی‌ام‌ال استفاده می‌شد، اما در سال‌های اخیر، حروف کوچک رایج‌تر و توصیه شده‌است.

 انواع عناصر 
سه نوع عنصر در اچ‌تی‌ام‌ال وجود دارد: عناصر معمولی، عناصر متنی خام و عناصر تهی.

 معمولاً هر دو تگ شروع و پایان را دارند، اگرچه برای برخی از عناصر تگ پایان یا هر دو تگ را می‌شود حذف کرد و به روشی مشابه ساخته می‌شوند:
 یک تگ شروع () که شروع یک عنصر را مشخص می‌کند، و ممکن است تعدادی از صفت‌های اچ‌تی‌ام‌ال را در خود جای دهد.
 محتوا، از جمله متن و عناصر دیگر.
 و تگ پایانی که در آن، نام عنصر با یک اسلش پیشوند شده‌است: .

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

 (که گاهی اوقات، عناصر منفرد یا عناصر مستقل یا عناصر غیرجفت نیز نامیده می‌شوند) فقط یک تگ شروع دارند (به شکل )، که می‌تواند هر کدام از صفت‌های اچ‌تی‌ام‌ال را داشته باشد. این عناصر ممکن است حاوی هیچگونه متن یا عناصر دیگری نباشند. برای سازگاری با اکس‌اچ‌تی‌ام‌ال، مشخصات اچ‌تی‌ام‌ال اجازه استفاده از فاصله اختیاری و اسلش را می‌دهد ( مجاز است). فاصله و اسلش در اکس‌اچ‌تی‌ام‌ال و سایر برنامه‌های اکس‌ام‌ال لازم است. دو عنصر خالی رایج، عبارتند از  (برای شکستن خط، مانند یک شعر یا یک آدرس) و  (برای ایجاد خط افقی). سایر عناصر این چنینی، اغلب به فایل‌های خارجی ارجاع می‌دهند، مانند عنصر تصویر () و صفت‌های موجود در این عناصر بر روی فایل خارجی مورد نظر اعمال می‌شوند. مثال دیگری از عنصر خالی  است که سینتکس آن به صورت زیر است:
<link rel="stylesheet" href="fancy.css" type="text/css">

در این مثال، عنصر ، مرورگر را به یک style sheet هدایت می‌کند تا هنگام ارائه سند اچ‌تی‌ام‌ال به کاربر، از آن استفاده کند. در دستور زبان اچ‌تی‌ام‌ال، صفت‌ها در میان دو علامت "..." (نقل قول) نوشته می‌شوند، اما اگر از کاراکترهای حروف، اعداد، خط فاصله و نقطه باشند، نیازی به استفاده از این علامت نیست: از طرف دیگر، هنگام استفاده از سینتکس اکس‌ام‌ال (اکس‌اچ‌تی‌ام‌ال)، همه صفت‌ها باید نقل قول شوند و قبل از براکت آخر تگ، استفاده از یک اسلش انتهایی با یک فاصله الزامی است:
<link rel="stylesheet" href="fancy.css" type="text/css" />

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

تگها به دو صورت نوشته می‌شوند:

 تگهای کوتاه که شروع و پایان ندارد.
 تگهای بلند که علامت شروع و پایان دارد.
بیشتر عناصر با یک تگ شروع و یک تگ پایان نوشته می‌شوند.

 نحوه نوشتن یک عنصر در HTML 
 یک عنصر با یک تگ شروع (تگ باز) آغاز می‌شود.
 یک عنصر به یک تگ پایان (تگ بسته) ختم می‌شود.
 محتوای یک عنصر نوشته‌های بین تگ شروع و پایان می‌باشد.
 بعضی از عناصر در HTML تهی هستند.
 عناصر تهی در همان تگ شروع بسته می‌شود.
 بیشتر عناصرHTML می‌توانند دارای خصوصیت هایی باشند.
البته بعضی از تگ‌ها در html5 منسوخ شدن و دیگه اعتبار ندارند و مرورگرها تگهای منسوخ شده را پشتیبانی نمی‌کند.

 تگ‌های کوتاه 
نام تگکاربرد تگ{{سخ}}برای شکستن خط و ایجاد خط جدید به کار می‌رود.برای قرار دادن تصویر در صفحه به کار می‌رود.<hr/>برای ایجاد یک خط در عرض صفحه به کار می‌رود.

 تگ‌های بلند 
نام تگکاربرد تگ<a>ایجاد لینک در صفحه وب<div>ایجاد طرح بندی یک قالب<image>قرار دادن تصویر در صفحه وب<p>برای ایجاد پاراگراف در صفحه<title>ساخت عنوان سایت

 خصوصیات تگ‌ها 
 نحوهٔ تعریف تگ‌ها و ویژگی هر تگ 
<a herf=” آدرس مقصد”> </a>
 <div style=”background-color:red;”><\div>
 <p> متن پاراگراف </p>
 <title> عنوان سایت </title>
<image src=”image/img.png”>برای تعریف خصوصیات تگ‌ها سه روش وجود دارد که هر تگ به یک روش نوشته می‌شود.

 خصوصیات id
 خصوصیات class
 خصوصیات style
صفات (attribute) در تگ‌های html به دو دسته تقسیم می‌شود:

 صفات عمومی (برای تمامی تگ‌ها می‌توان از این صفات استفاده کرد)
 صفات خصوصی (برای یک یا چندین تگ خاص می‌توان استفاده کرد)
 خصوصیات اصلی تگ‌های HTML 
نکته: این خاصیت‌ها در تگ‌های base , head , html , meta , param , style , title و script وجود ندارد.
نام تگکاربرد تگClassمشخص کننده کلاس تگ در کد نویسی برنامه است. این کلاس در کدنویسی CSS و زبان‌های اسکریپتی کاربرد دارد.idبرای تعریفID برای یک یا چندین تگ. مشخص کننده یک شناسه منحصر به فرد برای تگ در درون سند HTML است. توسط id می‌توان به تگ مورد نظر دست یافت.styleبرای تعریف استایل به‌صورت درون خطی (Inline) برای یک یا چندین تگ. یک خاصیت چند مقداری است که خصوصیات قالب دهی و اعمال سبک‌ها (CSS) را برای تگ مورد نظر مشخص می‌کند.titleاین صفت برای مشخص کردن اطلاعات بیشتر و عنوان برای عناصر استفاده می‌شود.

 تگ چیست؟ 
HTML به کمک برچسب‌ها (Tags) عناصر مختلف را کنار هم می‌چیند و هر کاربر با توجه به نیاز خود از آن‌ها استفاده می‌کند. تگ‌ها عناصری هستند که وظایف گوناگونی دارند و با فراخوانی هر کدام کارشان شروع شده و با بستن تگ کارشان تمام می‌شود.

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

 فرم کلی عنصر meta 
همانطور که در مقدمه‌ی این درس هم اشاره شده، عنصر meta برای افزودن انواع متادیتایی که نمی‌توان با استفاده از سایر عناصر مربوط به متادیتا یعنی title، link، style، script و base به صفحه افزود، کاربرد دارد. برای هر عنصر meta باید از بین صفت‌های charset، name، http-equiv و itemprop دقیقاً یکی را به کار گرفت. مطابق مستندات استاندارد HTML:

 از عنصر meta به همراه یک صفت name برای افزودن متادیتایی که در سطح سند (document level) قرار دارد، استفاده می‌شود.
 عنصر meta به همراه یک صفت http-equiv برای ایجاد یک pragma directive کاربرد دارد که دستورالعملی است معادل استفاده از یک http header.
 عنصر meta به همراه یک صفت charset برای تعیین مجموعه‌ی کاراکتری صفحه کاربرد دارد.
 عنصر meta به همراه یک صفت itemprop برای ایجاد متادیتای تعریف‌شده توسط کاربر (user-defined metadata) به کار می‌رود.

چنانچه از هر یک از صفت‌های بالا به‌جز صفت charset برای یک عنصر meta استفاده شود، باید یک صفت content نیز برای آن عنصر به کار گرفته شود. نحوه‌ی تعیین مجموعه‌ی کاراکتری با استفاده از عنصر meta و صفت charset را قبلاً دیده‌ایم. صفت itemprop و کاربرد آن نیز به بحث جداگانه‌ای نیاز دارد که در اینجا از ان صرف نظر می کنیم. اما در ادامه، با دو صفت دیگر یعنی name و http-equiv و مهمترین کاربردهای آنها آشنا می‌شویم.

عنصر اچ‌تی‌ام‌ال یک جزء مستقل از یک پروندهٔ اچ‌تی‌ام‌ال است. پرونده‌های اچ‌تی‌ام‌ال شامل ساختاری درختی از عناصر اچ‌تی‌ام‌ال و دیگر محتویات، مانند متن هستند. هر عنصر می‌تواند صفات تعیین‌شده‌ای داشته باشد. همچنین می‌تواند شامل محتواهای دیگر مثل متن یا عناصر دیگر باشد. این عناصر نشانه‌هایی هستند که معنای خاصی دارند و به منظور مشخصی به کار می‌روند؛ مثلا عنصر عنوان صفحه برای نمایش عنوان صفحه استفاده می‌شود.

 واژه‌نامه 

 منابع 




رده:اچ‌تی‌ام‌ال