خصیصه های HTML

خصیصه ها (Attributes) اطلاعات بیشتری در مورد عناصر HTML ارائه می کنند.

  • تمامی عناصر HTML دارای خصیصه هستند
  • تمامی خصیصه ها اطلاعات اضافی در مورد عنصر عرضه می کنند
  • خصیصه ها همیشه در تگ شروعی بیان می شوند
  • خصیصه ها معمولا به شکل نام/مقدار بیان می شوند: name="value"

خصیصه lang

زبان یک سند را می توان به صورت یک خصیصه تگ <html> اعلان کرد.

زبان از طریق خصیصه lang بیان می شود.

اعلان زبان برای برنامه های مخصوص مثل صفحه خوان ها و موتورهای جستجوگر مهم هستند:

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

...

</body>
</html>

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

خصیصه title

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

<p title="I'm a tooltip">
This is a paragraph.
</p>

خصیصه href

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

<a href="https://easy.parastar.info">این لینک دروس آسان است</a>

در ادامه این راهنما لینک ها و تگ <a> بطور کامل و با جزئیات بحث می شود.

خصیصه های Size

در زبان HTML تصاویر با استفاده از تگ <img> تعریف می شوند.

نام فایل منبع (src)، و سایر تصویر (عرض و طول) همگی به صورت خصیصه های عنصر مشخص می شوند. مثال:

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

در این مثال سایز تصویر به پیکسل تعریف شده است: width="104" یعنی عرض این تصویر 104 پیکسل است. تصاویر در HTML و تگ <img> به طور کامل در ادامه این راهنما بحث می شود.

خصیصه alt

خصیصه alt یک متن جایگزین (آلترناتیو) برای عنصر تعیین می کند، زمانی که تصویر نمایش نیابد.

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

مثال خصیصه alt:

<img src="/ palexa.jpg" alt="easy blog logo" width="104" height="142">

پیشنهاد: خصیصه ها را با حروف کوچک درج کنید

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

خصیصه عنوان را می توان به حروف بزرگ یا حروف کوچک نوشت مثل title یا TITLE

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

پیشنهاد: مقدار خصیصه در داخل گیومه گذاشته شود

در استاندارد HTML5 گذاشتن گیومه یا علامت نقل قول (") در دو طرف مقدار خصیصه الزامی نیست. خصیصه href که در بالا مثال زده شد را می توان به صورت زیر نوشت:

<a href=https://www.palexa.com>

در W3C نیز توصیه شده است که از گیومه استفاده شود و در زبان های خاص مثل XHTML استفاده از "" برای مقدار خصیصه ها اجباری است.

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

<p title=About palexa>

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

استفاده از علامت نقل قول تک یا زوج

گیومه دوبل (") برای مقدار خصیصه در HTML رایجتر است، اما می توان از تک گیومه (') استفاده کرد.

در بیشتر موقعیت هایی که مقدار خصیصه خودش حاوی گیومه دوبل است، ضروری است که از تک گیومه استفاده کرد:

<p title='John "ShotGun" Nelson'>

یا برعکس:

<p title="John 'ShotGun' Nelson">

خلاصه مطلب

  • تمامی عناصر HTML دارای خصیصه هستند
  • خصیصه title به صورت "راهنمای حبابی" اطلاعات اضافی و تشریحی ارائه می کند
  • خصیصه href اطلاعات آدرس لینک ها را مشخص می کند
  • خصیصه های width و height اطلاعات سایز تصاویر را مشخص می کنند
  • خصیصه alt متن جایگزین تصاویر است که در صورت بارگذاری نشدن عکس یا توسط صفحه خوان ها استفاده می شود
  • در پلسکا ما اسامی خصیصه را با حروف کوچک می نویسیم و مقدار خصیصه ها را همیشه بین گیومه دوبل قرار می دهیم

خصیصه ها در HTML

در اینجا لیست الفبایی از تعدادی از خصیصه های پر استفاده در HTML آمده است:

alt

متن جایگزین برای تصاویر مشخص می کند، زمانی که عکس نمایش نیابد

disabled

مشخص می کند که عنصر ورودی بایستی غیرفعال شود

href

آدرس وب (URL) لینک را مشخص می کند

id

یک شناسه منحصر برای عنصر تعیین میکند

src

آدرس وب (URL) تصویر را مشخص می کند

style

استیل CSS سر خط (inline CSS) یک عنصر را مشخص می کند

title

اطلاعاتی اضافی در مورد عنصر ارائه می دهد (به صورت راهنمای حبابی ظاهر می شود)

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

اگر در اجرای این راهنما به مشکل برخورد کردید و سایر سئوالات و پیشنهادات خود را در بخش سئوالات عمومی انجمن پلکسا مطرح نمایید. گروه توسعه وب پلکسا به سئوالات شما پاسخ خواهند داد.

عضویت در خبرنامه پلکسا

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

با ما شریک شوید

با ما باشید

قابل توجه وبمسترها

وبمستر گرامی

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