الفرق بين المراجعتين ل"CSS/:only-of-type"
< CSS
اذهب إلى التنقل
اذهب إلى البحث
ط (استبدال النص - '\[\[تصنيف:(.*)\]\]' ب'{{SUBPAGENAME}}') |
|||
سطر 53: | سطر 53: | ||
*مسودة [https://drafts.csswg.org/selectors-4/#only-of-type-pseudo Selectors Level 4]. | *مسودة [https://drafts.csswg.org/selectors-4/#only-of-type-pseudo Selectors Level 4]. | ||
*مواصفة [https://drafts.csswg.org/selectors-3/#only-of-type-pseudo Selectors Level 3]. | *مواصفة [https://drafts.csswg.org/selectors-3/#only-of-type-pseudo Selectors Level 3]. | ||
− | [[تصنيف:CSS]] | + | [[تصنيف:CSS|{{SUBPAGENAME}}]] |
− | [[تصنيف:CSS Selectors]] | + | [[تصنيف:CSS Selectors|{{SUBPAGENAME}}]] |
− | [[تصنيف:CSS pseudo-class]] | + | [[تصنيف:CSS pseudo-class|{{SUBPAGENAME}}]] |
مراجعة 15:37، 28 يناير 2018
الصنف الزائف :only-of-type
في CSS (أي pseudo-class) يُطابِق عنصرًا لا يملك أيّة عناصر أخوة (siblings) من نفس نوعه.
هذا المُحدِّد يُحدِّد جميع عناصر <p>
التي لا يوجد لها أخوة من النوع <p>
:
p:only-of-type {
background-color: lime;
}
ملاحظة: عندما عُرِّف هذا الصنف كان من الضروري أن يملك العنصر أبًا، لكن بدءًا من مواصفة Selectors Level 4 لم يعد ذلك ضروريًا. الشكل العام لهذا المحدد:
:only-of-type
أمثلة
لاحظ كيف استخدمنا الصنف الزائف :only-of-type
في المثال الآتي:
<main>
<div>I am `div` #1.</div>
<p>I am the only `p` among my siblings.</p>
<div>I am `div` #2.</div>
<div>I am `div` #3.
<i>I am the only `i` child.</i>
<em>I am `em` #1.</em>
<em>I am `em` #2.</em>
</div>
</main>
شيفرة CSS:
main :only-of-type {
color: red;
}
دعم المتصفحات
الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
الدعم الأساسي | 1.0 | 3.5 | 9.0 | 9.5 | 3.2 |
عدم الحاجة إلى وجود عنصر أب | 57 | 51 | ؟ | 44 | ؟ |
مصادر ومواصفات
- مسودة Selectors Level 4.
- مواصفة Selectors Level 3.