الفرق بين المراجعتين ل"CSS/:last-of-type"
< CSS
اذهب إلى التنقل
اذهب إلى البحث
ط (استبدال النص - '\[\[تصنيف:(.*)\]\]' ب'{{SUBPAGENAME}}') |
|||
سطر 53: | سطر 53: | ||
*مسودة [https://drafts.csswg.org/selectors-4/#last-of-type-pseudo Selectors Level 4]. | *مسودة [https://drafts.csswg.org/selectors-4/#last-of-type-pseudo Selectors Level 4]. | ||
*مواصفة [https://drafts.csswg.org/selectors-3/#last-of-type-pseudo Selectors Level 3]. | *مواصفة [https://drafts.csswg.org/selectors-3/#last-of-type-pseudo Selectors Level 3]. | ||
− | [[تصنيف:CSS]] | + | [[تصنيف:CSS|{{SUBPAGENAME}}]] |
− | [[تصنيف:CSS Selectors]] | + | [[تصنيف:CSS Selectors|{{SUBPAGENAME}}]] |
− | [[تصنيف:CSS pseudo-class]] | + | [[تصنيف:CSS pseudo-class|{{SUBPAGENAME}}]] |
مراجعة 15:38، 28 يناير 2018
الصنف الزائف :last-of-type
في CSS (أي pseudo-class) يُمثِّل آخر عنصر من نوعه في مجموعة من العناصر الأخوة.
p:last-of-type {
color: lime;
}
ملاحظة: عندما عُرِّف هذا الصنف كان من الضروري أن يملك العنصر أبًا، لكن بدءًا من مواصفة Selectors Level 4 لم يعد ذلك ضروريًا. الشكل العام لهذا المحدد:
:last-of-type
أمثلة
لاحظ كيف ستُنسَّق آخر فقرة <p>
من بين العناصر الأخوة:
<h2>Heading</h2>
<p>Paragraph 1</p>
<p>Paragraph 2</p>
شيفرة CSS:
p:last-of-type {
color: red;
font-style: italic;
}
لاحظ كيف يمكن استخدام هذا المُحدِّد على العناصر المتشعبة، تذكَّر أنَّ المُحدِّد العام *
سيُستخدَم ضمنيًا عند عدم التصريح عن مُحدِّد:
<article>
<div>This `div` is first.</div>
<div>This <span>nested `span` is last</span>!</div>
<div>This <em>nested `em` is first</em>, but this <em>nested `em` is last</em>!</div>
<b>This `b` qualifies!</b>
<div>This is the final `div`!</div>
</article>
شيفرة CSS:
article :last-of-type {
background-color: pink;
}
دعم المتصفحات
الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
الدعم الأساسي | 1.0 | 3.5 | 9.0 | 9.5 | 3.2 |
مصادر ومواصفات
- مسودة Selectors Level 4.
- مواصفة Selectors Level 3.