محددات ID

الدرس 5 من 15 في دورة محددات CSS على Coddy.

محدد المعرف (ID selector) هو نوع من محددات CSS التي تختار العناصر التي تمتلك سمة ID محددة. سمة ID هي سمة مخصصة يمكنك إضافتها إلى عناصر HTML لتمييزها بشكل فريد.

لتحديد عناصر بمعرف محدد، تستخدم رمز الهاش (#) متبوعاً بقيمة المعرف. على سبيل المثال، المحدد #my-id يختار العنصر الذي يحمل المعرف my-id.

إليك مثال على كيفية استخدام محدد المعرف لتنسيق صفحة ويب:

#my-id {
  color: red;
  font-size: 2em;
}

لإضافة معرف (id) إلى عنصر، اكتب:

<div id="my-id"></div>

تماماً مثل محددات الفئات (Class selectors)، ستقوم قاعدة CSS هذه بتنسيق العنصر الذي يحمل المعرف my-id ليكون باللون الأحمر وبحجم خط 2em.

التحدي

سهل

إليك تمرين لاختبار فهمك لمحددات المعرف (ID selectors):

قم بإنشاء صفحة ويب تحتوي على عنصرين من نوع div.
قم بإعطاء عنصر div الأول المعرف (ID) my-id.
استخدم محدد المعرف (ID selector) لتنسيق عنصر div الذي يحمل المعرف my-id ليكون بأي لون غير الأسود وبحجم خط 30px.

جرّب بنفسك

<html>
<head>
  <title>ID Selector Exercise</title>
  <style>
    /* CSS Code goes here */
  </style>
</head>
<body>
    
</body>
</html>

جميع دروس محددات CSS

1مقدمة في محددات CSS

الغرض من محددات CSS لماذا هي مهمة؟

4محددات الخصائص

مقدمة في محددات الخصائص التواجد والقيم المطابقة محددات قيم الخصائص محددات قيم الخصائص 2 محددات قيم الخصائص 3

2المحددات البسيطة

محددات النوع محددات Classمحددات IDالمحددات العامة

3محددات الربط (Combinator Selectors)

محدد الابن (Child selector)محدد الأحفاد (Descendant selector)محدد الشقيق المجاور (Adjacent sibling selector)محدد الشقيق العام (General sibling selector)