انتقل إلى محتوى الدرس

Word List and Language Match مطابقة الكلمة المستقلة ورمز اللغة

استهدف عناصر HTML بمرونة عبر محددات السمات السبع لمطابقة وجود السمة أو قيمتها التامة أو الكلمات المستقلة ورموز اللغات وبدايات الروابط وامتدادات الملفات.
2 صفوف تعليمية
لغة CSS
0 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

عندما تحتوي السمة على قائمة كلمات مفصولة بمسافات مثل data-tags="css layout featured" أو rel="noopener external"، يطابق محدد الكلمة المستقلة [data-tags~="featured"] الكلمة التامة featured بدقة دون أن يطابق بالخطأ كلمة ملتصقة مثل unfeatured.

أما مع رموز اللغات الإقليمية المكتوبة بشرطة مثل lang="ar" أو lang="ar-SA" أو lang="ar-EG"، فيطابق محدد رمز اللغة الفرعي [lang|="ar"] القيمة "ar" المنفردة وكل قيمة تبدأ بالمقطع "ar-" متبوعاً بشرطة مباشرة.

الصف 2 كود برمجي
CSS
[data-tags~="featured"] {
  border: 2px solid #7750b2;
  background-color: #f2ebf9;
}
[lang|="ar"] {
  border-right: 4px solid #0f766e;
  padding-right: 12px;
}