ویژگیهای HTML
در جلسهٔ قبل یاد گرفتید که عناصر از تگ و محتوا ساخته میشوند. attributeها به آن تگها اطلاعات اضافه میدهند. بدون attribute خیلی از عناصر کار واقعیشان را انجام نمیدهند — مثلاً لینک به آدرس نیاز دارد و تصویر به مسیر فایل.
attribute در HTML چیست؟
یک attribute HTML یک نام و مقدار است که داخل تگ شروع عنصر قرار میگیرد. به مرورگر چیزی دربارهٔ آن عنصر میگوید که همان متن قابلدید بین تگها نیست.
پاسخ مستقیم
attributeها الگوی سادهای دارند: name="value". متعلق به تگ باز هستند، قبل از > پایانی. مثالهای رایج شامل href برای لینکها و src بههمراه alt برای تصاویر است. جلسات بعد زیاد از attribute استفاده میکنند؛ الگو را یکبار اینجا یاد بگیرید.
ویژگی روی لینک و تصویر
html<a href="https://example.com">Visit Example</a>
<img src="cat.jpg" alt="A cat sitting on a chair">خواندن مثال
- روی لینک،
hrefآدرس مقصد را نگه میدارد - متن قابلدید لینک هنوز محتوای بین
<a>و</a>است - روی تصویر،
srcبه فایل تصویر اشاره میکند altمتن جایگزین میدهد وقتی تصویر بارگذاری نشود یا برای دسترسپذیری- هر دو attribute داخل تگ شروع هستند
قواعد نحوی که باید به خاطر بسپارید
- attribute را فقط در تگ شروع بگذارید — نه در تگ پایان
- نام attribute را با
=از مقدار جدا کنید - بیشتر مقدارها را در نقلقول بگذارید:
href="https://example.com" - میتوانید چند attribute در یک تگ شروع بگذارید و با فاصله جدا کنید
- در HTML مدرن نام attribute معمولاً با حروف کوچک نوشته میشود
چند ویژگی روی یک تگ
html<a href="https://example.com" title="Example website">Visit Example</a>اینجا href آدرس را تنظیم میکند و title میتواند متن راهنمای اضافه بدهد (اغلب بهصورت tooltip در مرورگر دسکتاپ). لازم نیست هر attribute اختیاری را روی هر تگ بگذارید — همانهایی را به کار ببرید که عنصر نیاز دارد.
attribute در برابر محتوا
محتوا چیزی است که بین تگ شروع و پایان مینشیند، مثل واژههای داخل پاراگراف. attributeها روی تگ شروع میمانند و عنصر را پیکربندی میکنند. قاطی کردنشان باگ میسازد: گذاشتن URL فقط در متن لینک، لینک کار نمیسازد؛ URL متعلق به href است.
نکته دربارهٔ عناصر خالی
عناصر خالی مثل img هنوز از attribute استفاده میکنند، حتی اگر تگ پایان جدا نداشته باشند. این طبیعی است: attribute عنصر را توصیف میکند؛ همان محتوای پیچیده نیست.
خودتان امتحان کنید
- یک صفحهٔ پایه HTML را در ویرایشگر باز کنید
- لینکی با attributeی
hrefبه یک URL واقعی یا نمونه اضافه کنید - یک
imgباsrcو متنaltمعنادار بگذارید (هر مسیر تمرینی یا نام جایگزین برای یادگیری نحو) - ذخیره کنید و صفحه را در مرورگر باز کنید
- روی لینک کلیک کنید و در منبع صفحه بررسی کنید که نشانهگذاری تصویر هست، حتی اگر فایل تصویر موجود نباشد
اشتباهات رایج
- نوشتن attribute روی تگ بسته
- فراموش کردن نقلقول دور مقدارهایی که به آن نیاز دارند
- attribute اشتباه برای کار (مثلاً گذاشتن URL در
srcروی لینک بهجایhref) - خالی گذاشتن
altروی تصاویر اطلاعاتی - فرض اینکه متن attribute همیشه بهصورت محتوای قابلدید صفحه ظاهر میشود — خیلیها رفتار یا دسترسپذیری را تنظیم میکنند
خلاصه
- attribute اطلاعات اضافه داخل تگ شروع میگذارد
- شکل معمول
name="value"است - لینکها به
hrefنیاز دارند؛ تصاویر معمولاً بهsrcوalt - محتوا بین تگهاست؛ attribute تگ را پیکربندی میکند
- میتوان چند attribute را روی یک تگ شروع ترکیب کرد
- درسهای بعد همین الگو را برای تیتر، فرم، رسانه و بیشتر بازاستفاده میکنند
🧠 دانش خود را بیازمایید
دانش خود را بیازمایید
خود را با این آزمون تعاملی به چالش بکشید و ببینید موضوع را چقدر خوب درک کردهاید
📝 دستورالعملها
- هر سوال را با دقت بخوانید
- بهترین پاسخ را برای هر سوال انتخاب کنید
- میتوانید آزمون را هر چند بار که میخواهید تکرار کنید
- پیشرفت شما در بالا نمایش داده میشود