HTML5 屬性與CSS 屬性:現代化之旅
在Web 開發領域,HTML5 徹底改變了我們創建表格的方式,消除了一些曾經必不可少的屬性。正如您在 Visual Studio 中遇到的那樣,cellpadding、cellspacing、valign 和align 不再是有效的 HTML5 表格屬性。
要取代這些屬性並保持所需的表格格式,CSS 屬性可以發揮作用。操作方法如下:
使用 CSS 填充複製 cellpadding:
使用 CSS 屬性 padding 在表格單元格之間添加空格,就像 cellpadding 一樣。例如:
<code class="css">th, td { padding: 5px; }</code>
使用 CSS border-collapse 和 border-spacing 模擬 cellspacing:
cellspacing 被 border-collapse 和 border-spacing 取代。如果要保持表格單元格之間的空間,請將border-collapse 設定為分隔並使用border-spacing 指定所需的間距:
<code class="css">table { border-collapse: separate; border-spacing: 5px; }</code>
要完全刪除間距(相當於cellspacing="0 "),使用:
<code class="css">table { border-collapse: collapse; border-spacing: 0; }</code>
用CSS Vertical-align 取代valign:
使用vertical-align 控製表格單元格內容的垂直對齊方式,類似於valign:
<code class="css">th, td { vertical-align: top; }</code>
使用CSS 邊距將表格居中:
要將表格在頁面上居中,請將對齊替換為邊距:
<code class="css">table { margin: 0 auto; }</code>
透過使用這些CSS 屬性,您可以在HTML5 中複製cellpadding、cellspacing、valign 和align 的功能,確保您的表格保持視覺吸引力並符合現代網路標準。
以上是如何使用 CSS 屬性來取代已棄用的 HTML5 表格屬性?的詳細內容。更多資訊請關注PHP中文網其他相關文章!