首頁 >web前端 >css教學 >為什麼邊距對錶格單元格元素不起作用?

為什麼邊距對錶格單元格元素不起作用?

Patricia Arquette
Patricia Arquette原創
2024-12-18 15:11:14163瀏覽

Why Doesn't Margin Work on Table-Cell Elements?

為什麼 Table-Cell 元素的 Margin 失敗?

儘管將 margin: 5px 分配給帶有 display: table-cell 的相鄰 div 元素,但沒有出現 margin。這是什麼原因?

了解原因

根據 MDN 文檔,margin 屬性排除了除 table-caption、table 和 inline-table 之外的表格顯示類型的元素。因此,邊距對於具有 display: table-cell 的元素無效。

解決問題

不要使用邊距,請考慮使用 border-spacing 屬性。此屬性適用於具有 display: table 佈局和 border-collapse: alone 的父元素。

示例代碼

HTML

CSS

自定義邊距值

border-spacing屬性也可以採用兩個值,允許不同的水平和垂直邊距。

以上是為什麼邊距對錶格單元格元素不起作用?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn