شبكة تعلم مع ناو

ما هو ::marker في CSS؟

::marker عنصر زائف (Pseudo-element) في CSS ينسّق علامة عنصر القائمة: النقطة في ul أو الرقم في ol.

li::marker {
  color: red;
}

هذا يجعل النقاط أو الأرقام حمراء، بينما يبقى نص العنصر بلونه.

أمثلة أخرى

li::marker {
  font-weight: bold;
  font-size: 1.2em;
}

ul.check li::marker {
  content: '✓ ';
}

قبل ::marker كان المطورون يخفون العلامة الأصلية ويرسمون بديلًا بـ ::before. اليوم صار الأمر أبسط بكثير.

اختبر نفسك

خمسة أسئلة سريعة، مع الإجابة والشرح بعد كل سؤال.