جاري التحميل...
id في HTML
بعد class يأتي id لاسم عنصر واحد فريد.
لماذا الأسماء الفريدة مهمة
الروابط والأدوات تفترض تطابقاً واحداً.
إجابة مباشرة
id="faq" على عنصر واحد. href="#faq". في CSS #faq. لا تكرر id ولا تكتب id="#faq".
📊 id versus class
| Feature | id | class |
|---|---|---|
| Uniqueness | One per page (ideally) | Many elements may share |
| HTML attribute | id="faq" (no #) | class="tip" (no .) |
| CSS selector | #faq | .tip |
| Common uses | Bookmarks, unique hooks, script targets | Reusable styles and groups |
رابط fragment إلى عنوان فريد
رابط أعلى وعنوان أسفل بنفس الاسم.
Unique id and fragment link
html
HTML Code
<p><a href="#faq">Jump to FAQ</a></p>
<h2 id="faq">FAQ</h2>
<p>Answers go here.</p>قراءة مثال fragment
-
في الرابط فقط
- id عارٍ في السمة
خطاف CSS فريد بـ #id
لوحة واحدة بارزة — بحذر.
Unique id with CSS
html
HTML Code
<div id="promo">
<h2>Limited offer</h2>
<p>One panel, one unique hook.</p>
</div>
<style>
#promo { border: 2px solid #0a7; padding: 12px; }
</style>قراءة مثال النمط الفريد
-
promo في CSS
- لا # داخل السمة
اختيار id أو class
أكثر من عنصر؟ class. هدف واحد؟ id.
تمرين
- عنوان بـ id
- رابط # والقفز
- أزل التكرار
- استخدم class لمظهر مشترك
أخطاء شائعة
- id مكرر
-
داخل السمة
- id لكل نمط مشترك
ملخص
- id فريد
-
في الرابط وCSS
- class للمشاركة
🧠 اختبر معرفتك
جاهز للبدء
اختبر معرفتك
تحدى نفسك مع هذا الاختبار التفاعلي واكتشف مدى فهمك للموضوع
6
الأسئلة
70%
للنجاح
∞
الوقت
∞
المحاولات
📝 التعليمات
- اقرأ كل سؤال بعناية
- اختر أفضل إجابة لكل سؤال
- يمكنك إعادة الاختبار عدة مرات كما تريد
- سيتم عرض تقدمك في الأعلى