首頁  >  文章  >  web前端  >  如何以百分比設定表格儲存格的最大寬度?

如何以百分比設定表格儲存格的最大寬度?

Susan Sarandon
Susan Sarandon原創
2024-11-12 14:31:02839瀏覽

How to Set the Maximum Width of Table Cells with Percentages?

以百分比設定表格儲存格的最大寬度

在追求最佳化表格版面的過程中,出現了有關單一表格儲存格操作的問題。其中一個問題涉及使用百分比來設定表格單元格的最大寬度。儘管付出了努力,但諸如所提供的示例之類的嘗試常常無法達到預期的效果。

這個挑戰的解決方案在於 CSS 屬性 table-layout:fixed。透過將此屬性套用至相關表格,後續的 max-width 屬性將如預期生效。

CSS 代碼:

table {
  width: 100%;
  table-layout: fixed;
}

已更新HTML:

<table class="fixed-table">
  <tr>
    <td>Test</td>
    <td>A long string blah blah blah</td>
  </tr>
</table>
透過利用 CSS 屬性和特性的組合,您現在可以使用百分比來設定任何表格單元格的最大寬度,從而確保更加精緻和響應靈敏的表格佈局。
.fixed-table td {
  max-width: 67%;
}

以上是如何以百分比設定表格儲存格的最大寬度?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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