عرض مصدر CSS/empty-cells

<noinclude>{{DISPLAYTITLE:الخاصية <code>empty-cells</code>}}</noinclude>
الخاصية <code>empty-cells</code> في CSS تُحدِّد كيف يجب أن يعرض المتصفح خلفية وإطار خلايا الجداول <code>[[HTML/table|<nowiki><table></nowiki>]]</code> التي ليس فيها محتوى ظاهر. لن يكون لهذه الخاصية أثرٌ إلا إذا كانت الخاصية <code>[[CSS/border-collapse|border-collapse]]</code> مضبوطةً إلى <code>separate</code>.<syntaxhighlight lang="css">
/* كلمات محجوزة */ 
empty-cells: show;
empty-cells: hide;

/* القيم العامة */
empty-cells: inherit;
empty-cells: initial;
empty-cells: unset;
</syntaxhighlight>
{| class="wikitable" style="width: 100%;"
|-
! scope="row" style="width: 20%;" |[[CSS/initial value|القيمة الابتدائية]]
|<code>show</code>
|-
! scope="row" |تُطبَّق على
|خلايا الجداول.
|-
! scope="row" |قابلة للوراثة
|نعم
|-
!قابلة للحركة
|لا
|-
! scope="row" |القيمة المحسوبة
|كما حُدِّدَت.

|}

== أمثلة ==
سنستخدم في المثال الآتي جدولين <code>[[HTML/table|<nowiki><table></nowiki>]]</code> فيهما خلايا ليس فيها محتوى، واستعملنا القيمة <code>show</code> (وهي القيمة الافتراضية) على أوّل جدول، والقيمة <code>hide</code> على الجدول الثاني:<syntaxhighlight lang="html">
<table class="show">
  <tr>
    <td></td>
    <td>2</td>
    <td></td>
  </tr>
  <tr>
    <td>4</td>
    <td></td>
    <td>6</td>
  </tr>
  <tr>
    <td></td>
    <td>8</td>
    <td></td>
  </tr>
</table>

<table class="hide">
  <tr>
    <td></td>
    <td>2</td>
    <td></td>
  </tr>
  <tr>
    <td>4</td>
    <td></td>
    <td>6</td>
  </tr>
  <tr>
    <td></td>
    <td>8</td>
    <td></td>
  </tr>
</table>

</syntaxhighlight>شيفرة CSS:<syntaxhighlight lang="css">
.show { empty-cells: show; }

.hide { empty-cells: hide; }

td {
  border: 1px solid gray;
  background-color: #f8f9fa;
  padding: 0.5rem;
}
</syntaxhighlight>
== دعم المتصفحات ==
{| class="wikitable"
!الميزة
!|Chrome
!Firefox
!Internet Explorer
!Opera
!Safari
|-
! الدعم الأساسي
|1.0
|1.0
|8.0
|4.0
|1.2
|}
== البنية العامة ==
الخاصية <code>empty-cells</code> تقبل إحدى الكلمتين المحجوزتين التاليتين.
=== القيمة <code>show</code> ===
سيُعرَض الإطار والخلفية في الخلايا الفارغة كما في غيرها.
=== القيمة <code>hide</code> ===
لن يُعرَض الإطار والخلفية في الخلايا الفارغة.
=== البنية الرسمية ===
<syntaxhighlight lang="css">
empty-cells: show | hide;

</syntaxhighlight>
== مصادر ومواصفات ==
* مواصفة ‎[http://www.w3.org/TR/CSS2/tables.html#empty-cells CSS Level 2 (Revision 1)‎]. 
[[تصنيف:CSS|{{SUBPAGENAME}}]]
[[تصنيف:CSS Property|{{SUBPAGENAME}}]]
[[تصنيف:CSS Table|{{SUBPAGENAME}}]]