صفات در HTML

یادگیری HTML

تعداد بازدید : 6019

تاریخ و ساعت انتشار : یک شنبه 15 مرداد 1396 12:14

همه عناصر HTML میتوانند صفاتی داشته باشند. صفات ، اطلاعات تکمیلی درباره عناصر HTML ارائه می کنند. صفات همیشه در تگ آغاز قرار می گیرند و به صورت جفتی از نام و مقدار نوشته می شوند. مانند : name="value"

صفت lang

زبان سند را می توان در تگ <html> تعیین کرد.این کار را با استفاده از صفت lang انجام می دهیم. تعیین زبان سند برای دسترسی اپلیکیشن ها و موتورهای جستجو بسیار مهم است.

<!DOCTYPE html>
<html lang="en-US">
<body>

...

<body/>
<html/>

دو حرف اول (en) مشخص کننده زبان است. اگر برای این زبان گویش های مختلفی وجود داشته باشد ، از دو حرف دیگر نیز استفاده می شود (US)

صفت title

در مثال زیر یک صفت title برای عنصر <p> در نظر گرفته شده است. مقدار مشخص شده برای این صفت بصورت یک tooltip یا همان ابزار راهنما ، به هنگام نگه داشتن ماوس روی پاراگراف ، نمایش داده خواهد شد.

صفت title

<p title="این یک متن راهنما است">
این یک پاراگراف است
</p>

مشاهده مثال

صفت href

لینک ها را با تگ <a> مشخص میکنیم ، اما آدرس لینک باید با استفاده از صفت href در داخل تگ آغاز <a> مشخص شود.

صفت href

<a href="http://www.webmehraz.com">این یک لینک است</a>

مشاهده مثال

درباره تگ لینک و سایر موارد مربوط به لینک ها ، در درس لینک های HTML بیشتر یاد خواهید گرفت.

صفت size

تصاویر در HTML با استفاده از تگ <img> قرار می گیرند. نام فایل منبع (src) و اندازه تصویر (width & heigh) به عنوان صفات عنصر تصویر ارائه می شوند :

صفت img

<img src="webmehraz.jpg" width="104" height="142">

مشاهده مثال

اندازه تصاویر با پیکسل تعیین می شود :

"width="104

یعنی به عرض 104 پیکسل . در مورد تصاویر و تگ ها و صفات مربوط به آن در درس تصاویر در HTML یاد خواهید گرفت.

صفت alt

این صفت متنی جایگزین را برای استفاده و نمایش مشخص می کند. زمانی که تصویر قابل نمایش نباشد این متن نمایش داده می شود. استفاده از این سفت باعث می شود تا دستگاه هایی نظیر راهنمای افراد نابینا ، بتوانند تصاویر را بخوانند. همچنین موتورهای جستجو نیز در رابطه با تصاویر موجود در محتوای صفحه وب ، نابینا محسوب می شوند. زیرا نمی توانند محتوای تصویر را تشخیص دهند. بنابراین با استفاده از صفت alt به موتور جستجو توضیح می دهیم که چه چیزی در این تصویر وجود دارد.

صفت alt

<img src="webmehraz.jpg" alt="webmehraz.com" width="104" height="142">

مشاهده مثال

پیشنهاد : در صفات از حروف کوچک استفاده کنید.
در استاندارد HTML5 نیازی به استفاده از حروف کوچک در نام صفات ندارد. به عنوان مثال title یا TITLE هیچ فرقی با یکدیگر ندارند. اما کنسرسیوم جهانی وب W3C در HTML حروف کوچک را پیشنهاد می کند و در عین حال برای اسناد با نوع XHTML بطور سختگیرانه ای حروف کوچک درخواست می کند.
در وب مهراز ، ما همیشه از حروف کوچک در نام صفات استفاده می کنیم.
پیشنهاد : مقدار صفات را داخل کوتیشن مارک قرار دهید.
HTML5 در مقادیر صفات ، کوتیشن مارک درخواست نمی کند. به صفت href در مثال زیر توجه کنید :

علامت کوتیشن در مقدار صفات

<a href=http://www.webmehraz.com>

مشاهده مثال

کنسرسیوم جهانی وب W3C در HTML کوتیشن مارک را پیشنهاد می کند و در عین حال برای اسناد با نوع XHTML بطور سختگیرانه ای کوتیشن مارک را درخواست می کند.
گاهی اوقات استفاده از کوتیشن مارک ضروری است ، همانطور که در مثال زیر خواهید دید ، صفت title درست نمایش داده نمی شود. بخاطر اینکه در مقدار صفت یاد شده ، یک فاصله وجود دارد :

علامت کوتیشن در مقدار صفات ضروری است

 <p title=درباره وب مهراز>

مشاهده مثال

در این حالت وقتی ماوس را بر روی پاراگراف دارای صفت title قرار می دهیم ، فقط کلمه اول مقدار صفت را مشاهده می کنیم.
استفاده از کوتیشن مارک بسیار متدادول است و از قلم انداختن آن باعث ایجاد ارور هایی می شود.
در وب مهراز ، ما همیشه از کوتیشن مارک استفاده می کنیم.
کوتیشن مارک دوبل یا تکی؟؟
متداول ترین نوع استفاده از کوتیشن مارک برای مقادیر صفات ، کوتیشن مارک دوبل است. اما کوتیشن مارک تکی نیز استفاده می شود. البته در برخی موارد که خود مقدار صفت حاوی کوتیشن مارک می باشد ، ضروری است که از تکی استفاده کنیم. یا برعکس :

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

دانلود فایل PDF مقاله درس بعدی درس قبلی

نظر شما

نظرات