صفات html

صفات html

آموزش html  درس پنجم

صفات html
صفات html

صفات html اطلاعات اضافی در مورد عناصر HTML ارائه می دهند. در اینجا انواع مختلفی از صفات html را با هم مرور می کنیم. تعریف صفات روش خاص خود را دارد.

صفات  HTML

• تمام عناصر HTML می توانند دارای صفات باشند.
• صفات  اطلاعات اضافی در مورد عنصر ارائه می کنند.
• صفات  همیشه در تگ  شروع مشخص می شوند.
• عناوین معمولاً در یک  جفت مانند name = “value ”   می آیند.

مشخصه href

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

<a href="https://www.behtarinideh.com">This is a link</a>

درباره لینک ها و تگ <a> بعداً بیشتر آموزش خواهید دید.

ویژگی  src

تصاویر HTML با برچسب <img> تعریف می شوند.
نام فایل منبع (src) و اندازه تصویر (عرض و ارتفاع) به عنوان ویژگی ها ارائه می شوند:
مثال

<img src="img_girl.jpg">

width and height

تصاویر در HTML دارای مجموعه ای از ویژگی های اندازه  هستند ، که عرض و ارتفاع تصویر را مشخص می کند:

<img src="img_girl.jpg" width="500" height="600">

اندازه تصویر در پیکسل مشخص شده است: عرض = “۵۰۰” به معنای ۵۰۰ پیکسل عرض است.

ویژگی alt

زمانی که یک تصویر را نمی توان نمایش داد، ویژگی  alt  از یک متن جایگزین استفاده می کند.

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

<img src="img_girl.jpg" alt="Girl with a jacket">

خصیصه alt نیز مفید است اگر تصویر وجود ندارد:

چه اتفاقی می افتد وقتی که ما سعی می کنیم تصویری را که نیست نمایش بدهیم ؟

مثال :

<img src="img_typo.jpg" alt="Girl with a jacket">

ویژگی  style

ویژگی  style   برای مشخص کردن ظاهر یک عنصر، مانند رنگ، فونت، اندازه و غیره استفاده می شود.

مثال :

<p style="color:red">I am a paragraph</p>

مشخصه lang

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

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

 ...

</body>
</html>

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

حتما بخوانید:  وب سایت های استاتیک

مشخصه title

در اینجا  ویژگی title  به عنصر  <p> اضافه شده است. مقدار مشخصه title  هنگامی که ماوس بر روی پاراگراف است به عنوان یک  راهنمای ابزار(tooltip) نمایش داده می شود.

مثال

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

پیشنهاد ما: استفاده از ویژگی ها با حروف کوچک  است

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

ما پیشنهاد می کنیم: مقدار علامت نقل قول

HTML5     استاندارد نیازی به نقل قول در اطراف مقادیر attribute ندارد.
ویژگی href، نشان داده شده در بالا، می تواند به صورت زیر نوشته شود:
مثال

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

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

<p title=About behtarinideh>

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

نقل قول دوتایی یا تکی ؟

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

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

یا بر خلاف آن :

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

خلاصه ی درس
• تمام عناصر HTML می توانند دارای صفات باشند.
• صفت title  اطلاعات اضافی “tool-tip”  را فراهم می کند.
• ویژگی href اطلاعات آدرس را برای لینک ها فراهم می کند.
• ویژگی های width و height اطلاعات اندازه را برای تصاویر ارائه می کنند.
• ویژگی alt متن را برای خوانندگان صفحه فراهم می کند.
• در اینجا ، ما همیشه از حروف کوچک برای نام صفات استفاده می کنیم.
• در سایت بهترین ایده  ما همیشه  برای مقادیر صفات  از نقل قول های دوتایی استفاده می کنیم.

حتما بخوانید:  HTML5 Canvas

صفات  HTML

در زیر یک لیست  به صورت حروف الفبا از برخی از صفات وجود دارد که  اغلب در HTML استفاده می شود:
صفت     توضیح
alt                یک متن جایگزین برای یک تصویر را تعیین می کند، هنگامی که تصویر را نمی توان نمایش داد
disabled         تعیین می کند که یک عنصر ورودی باید غیرفعال شود
href     )                URL آدرس وب) را برای یک لینک مشخص می کند
id                   شناسه منحصر به فرد برای یک عنصر را مشخص می کند
src               نشانی اینترنتی (آدرس وب) برای یک تصویر را مشخص می کند
style            یک سبک CSS درونی برای یک عنصر را مشخص می کند
title                اطلاعات اضافی در مورد یک عنصر را مشخص می کند (به عنوان tool tip نمایش داده می شود)

آموزش  html  درس ششم

امتیاز کاربران به این مطلب
۱ نفر - میانگین: ۵
تلگرام

دیدگاه‌تان را ثبت کنید:

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

2 × 1 =

PHN0eWxlPi5oX2lmcmFtZS1hcGFyYXRfZW1iZWRfZnJhbWV7cG9zaXRpb246cmVsYXRpdmU7fSAuaF9pZnJhbWUtYXBhcmF0X2VtYmVkX2ZyYW1lIC5yYXRpbyB7ZGlzcGxheTpibG9jazt3aWR0aDoxMDAlO2hlaWdodDphdXRvO30gLmhfaWZyYW1lLWFwYXJhdF9lbWJlZF9mcmFtZSBpZnJhbWUge3Bvc2l0aW9uOmFic29sdXRlO3RvcDowO2xlZnQ6MDt3aWR0aDoxMDAlOyBoZWlnaHQ6MTAwJTt9PC9zdHlsZT48ZGl2IGNsYXNzPSJoX2lmcmFtZS1hcGFyYXRfZW1iZWRfZnJhbWUiPiA8c3BhbiBzdHlsZT0iZGlzcGxheTogYmxvY2s7cGFkZGluZy10b3A6IDU3JSI+PC9zcGFuPjxpZnJhbWUgc3JjPSJodHRwczovL3d3dy5hcGFyYXQuY29tL3ZpZGVvL3ZpZGVvL2VtYmVkL3ZpZGVvaGFzaC85dHk0VS92dC9mcmFtZSIgYWxsb3dGdWxsU2NyZWVuPSJ0cnVlIiB3ZWJraXRhbGxvd2Z1bGxzY3JlZW49InRydWUiIG1vemFsbG93ZnVsbHNjcmVlbj0idHJ1ZSIgPjwvaWZyYW1lPjwvZGl2Pg==
با سپاس از ثبت دیدگاه شما دوست عزیز
از تماشای این ویدیو لذت ببرید ...
فقط چند ثانیه تا دانلود فاصله دارید!
* دانلود فایل سخنرانی استیو جابز ...
ایبوک هدف‌گذاری موثر
زودتر از آنچه فکرش را می‌کنید به خواسته‌هایتان دست پیدا کنید!
* لینک دانلود بلافاصله ایمیل می‌شود.
چهار عامل شگفت انگیز کسب درآمد چیست؟
فقط چند ثانیه تا دانلود فاصله دارید!
* سه ایده کسب و کار خانگی پولساز
فقط چند ثانیه تا دانلود فاصله دارید!
* ایبوک: ده مکان عالی برای پیدا کردن یک ایده جدید
فقط چند ثانیه تا دانلود فاصله دارید!
* دانلود ویدیوی جذاب و با کیفیت مصاحبه جک ما
از همین امروز شروع کنید
بدون تجربه و دانش فنی وارد دنیای درآمدهای اینترنتی شوید!
فایل‌های آموزشی برای شما ایمیل می‌شود.
فقط چند ثانیه تا دریافت این فایل آموزشی فاصله دارید!
فایل‌های آموزشی ویژه اعضای سایت
* اگر عضو نیستید با وارد کردن ایمیل‌تان به این فایل دسترسی پیدا می‌کنید
دسترسی مخصوص اعضای سایت
عضو سایت نیستید؟
فقط کافیه نام و ایمیل‌تان را وارد کنید و ...
* دسترسی سریع به تمام فایل‌های آموزشی
هدیه ما به شما
با سپاس از اینکه دیدگاه تان را در سایت ما ثبت کردید.


یک کوپن تخفیف 30%
  • مشاوره حضوری
  • دوره های آنلاین
  • بسته های آموزشی
  • محصولات دانلودی
  • وبینارهای آموزشی
  این کد فقط یکبار به شما نمایش داده می‌شود.
کد: qwert
ورود کاربران
* دسترسی رایگان به بخش آکادمی