id یکی از چهار اتریبیوت های جهانی است که میتوان به کمک آن نامی منحصر به فرد تعریف کرد. Id باید در تمام سند منحصر به فرد باشد و تکرار نشود. هدف از آن این است که در زمان بوک مارک، دستور اسکریپتی یا استایل دادن قابل شناسایی باشد.
مقدار اتریبیوت id باید مبهم باشد. این بدان معناست که پیاده سازها نباید از مقدار id برای منتقل کردن اطلاعات استفاده کنند و نباید معنای خاصی، مثلا هدف معنایی داشته باشد.
مقدار اتریبیوت id نمیتواند فضای سفید (space، tab، و ...) داشته باشد.
مثال
<!DOTYPE html> <html> <head> <style> #exciting { background: linear-gradient(to bottom, #ffe8d4, #f69d3c); border: 1px solid #696969; padding: 10px; border-radius: 10px; box-shadow: 2px 2px 1px black; } </style> </head> <body> <p>A normal, boring paragraph. Try not to fall asleep.</p> <p id="exciting">The most exciting paragraph on the page. One of a kind!</p> </body> </html>
A normal, boring paragraph. Try not to fall asleep.
The most exciting paragraph on the page. One of a kind!
تفاوت بین کلاس و id
- id باید در تمام سند HTML منحصر به فرد باشد و تکرار نشود درحالی که کلاس میتواند چندین بار در سند HTML تکرار شود.
- برخلاف کلاس، مقدار id نمیتوان شامل فضای خالی باشد.
بوکمارک با کمک id و لینک
برای فرستادن کاربر به یک جای مشخص از صفحه وب از بوکمارک استفاده میشود. بوکمارک ها با کمک id ایجاد میشود و سپس به آن id لینک میشوند.
مثال
<a href="#c4">Jump to Chapter 4</a> <h2 id="c4">Chapter 4</h2>
نکاتی که باید در ذهن داشته باشید
- اتریبیوت id یک اتریبیوت جهانی است و برای همه المان ها، حتی المان های inline هم استفاده میشود.
- در CSS، برای انتخاب یک المان توسط نام id ، قبل از نام id کاراکتر (#) نوشته میشود.
- id باید در تمام سند HTML منحصر به فرد باشد و تکرار نشود.