حشو وتباعد جدول HTML

يمكن لجداول HTML ضبط المساحة المتروكة داخل الخلايا وكذلك المسافة بين الخلايا.

جدول HTML - حشو الخلية

مساحة الخلية هي المسافة بين حواف الخلية ومحتوى الخلية.

بشكل افتراضي ، يتم تعيين المساحة المتروكة على 0.

لإضافة مساحة متروكة في خلايا الجدول ، استخدم paddingخاصية CSS:

th, td {
padding: 15px;
}

لإضافة مساحة متروكة أعلى المحتوى فقط ، استخدم padding-topالخاصية.

والجانب الآخر مع padding-bottom، padding-leftوالخصائص padding-right:

th, td {
  padding-top: 10px;
  padding-bottom: 20px;
  padding-left: 30px;
  padding-right: 40px;
}

تباعد الخلايا هو المسافة بين كل خلية.

بشكل افتراضي ، يتم تعيين المساحة على 2 بكسل.

لتغيير المسافة بين خلايا الجدول ، استخدم border-spacingخاصية CSS على table العنصر:

table {
border-spacing: 30px;
}