الفرق بين المراجعتين لصفحة: «CSS/:empty»

من موسوعة حسوب
< CSS
لا ملخص تعديل
 
ط استبدال النص - '\[\[تصنيف:(.*)\]\]' ب'{{SUBPAGENAME}}'
سطر 47: سطر 47:
*مسودة [https://drafts.csswg.org/selectors-4/#empty-pseudo Selectors Level 4].
*مسودة [https://drafts.csswg.org/selectors-4/#empty-pseudo Selectors Level 4].
*مواصفة [https://drafts.csswg.org/selectors-3/#empty-pseudo Selectors Level 3].
*مواصفة [https://drafts.csswg.org/selectors-3/#empty-pseudo Selectors Level 3].
[[تصنيف:CSS]]
[[تصنيف:CSS|{{SUBPAGENAME}}]]
[[تصنيف:CSS Selectors]]
[[تصنيف:CSS Selectors|{{SUBPAGENAME}}]]
[[تصنيف:CSS pseudo-class]]
[[تصنيف:CSS pseudo-class|{{SUBPAGENAME}}]]

مراجعة 15:37، 28 يناير 2018

الصنف الزائف ‎:empty في CSS (أي pseudo-class) يُمثِّل أي عنصر ليس له أبناء، والأبناء يمكن أن تكون عقد عناصر (element nodes) أو عقدًا نصيةً (text nodes) بما في ذلك الفراغات. لن تؤثر التعليقات على اعتبار العنصر فارغًا أم لا.

div:empty {
  background: lime;
}

الشكل العام لهذا المحدد:

:empty

أمثلة

لدينا في المثال الآتي ثلاثة عناصر <div>، أولها يحتوي تعليقًا فقط، والثاني يحتوي على عقدة نصية، والثالث يحتوي على تعليق لكن هنالك فراغات قبله:

<div class="box"><!-- I will be lime. --></div>
<div class="box">I will be pink.</div>
<div class="box">
    <!-- I will be pink because of the whitespace around this comment. -->
</div>

شيفرة CSS:

.box {
  background: pink;
  height: 80px;
  width: 80px;
  margin: 1em;
}

.box:empty {
  background: lime;
}

دعم المتصفحات

الميزة Chrome Firefox Internet Explorer Opera Safari
الدعم الأساسي 1.0 1.0 9.0 9.5 3.1

مصادر ومواصفات