الصنف :not()
< CSS
الصنف الزائف :not()
في CSS (أي pseudo-class) يُمثِّل العناصر التي لا تُطابِق مُحدِّدًا أو أكثر، يسمى هذا الصنف أيضًا بصنف النفي الزائف (negation pseudo-class).
هذا المُحدِّد يُحدِّد أيّة عناصر ليست <p>
:
:not(p) {
color: blue;
}
ملاحظات:
- يمكن كتابة مُحدِّدات ليس لها فائدة، مثل
:not(*)
التي تُطابِق أيّ عنصر ليس عنصرًا، أي أنَّ هذا المُحدِّد لن يُطبَّق أبدًا. - يمكن أن يزيد هذا الصنف من درجة التحديد للقاعدة، فمثلًا المُحدِّد
#foo:not(#bar)
يؤدي إلى مطابقة ما يطابقه #foo
لكن بدرجة تحديد أكبر. - المُحدِّد
:not(.foo)
سيُطابِق كل العناصر التي ليس لها الصنفfoo
بما في ذلك<html>
و<body>
. - سيُطبَّق هذا المُحدِّد على عنصر واحد، أي لا يمكنك استخدامه لاستثناء جميع العناصر الأب، فمثلًا المُحدِّد
body :not(table) a
سيُطبَّق على الروابط الموجودة داخل الجدول، لأنَّ العنصر<tr>
سيُطابَق لأنه ليس جدولًا.
يقبل الصنف الزائف :not()
قائمةً من المُحدِّدات مفصولٌ بينها بفاصلة، ولا يجوز أن تحتوي تلك المُحدِّدات على أصناف زائفة أخرى. لاحظ أنَّ دعم استخدام أكثر من مُحدِّد ما يزال ضعيفًا (راجع قسم «دعم المتصفحات»):
:not( <selector># )
أمثلة
لاحظ كيف استخدمنا الصنف الزائف :not()
في المثال الآتي:
<p>I am a paragraph.</p>
<p class="fancy">I am so very fancy!</p>
<div>I am NOT a paragraph.</div>
شيفرة CSS:
.fancy {
text-shadow: 2px 2px 3px gold;
}
p:not(.fancy) {
color: green;
}
body :not(p) {
text-decoration: underline;
}
body :not(div):not(span) {
font-weight: bold;
}
body :not(.crazy, .fancy) {
font-family: sans-serif;
}
دعم المتصفحات
الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
الدعم الأساسي | 1.0 | 1.0 | 9.0 | 9.5 | 3.2 |
أكثر من مُحدِّد | غير مدعومة | غير مدعومة | غير مدعومة | غير مدعومة | 9.0 |
مصادر ومواصفات
- مسودة Selectors Level 4.
- مواصفة Selectors Level 3.