溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
小編給大家分享一下html中怎么解決表格單元格td設置寬度無效的問題，希望大家閱讀完這篇文章后大所收獲，下面讓我們一起去探討吧！
在做table頁面時，有時對td設置的寬度是無效的，td的寬度始終有內部的內容撐開，可以設置padding，但直接設置width卻無效，下面我們來具體看下這個示例：
<div>
<table border="1px">
<tr>
<td width="100px" style="width: 100px !important;">1000800</td>
<td>1000000</td>
<td>1000000</td>
</tr>
<tr>
<td>1000000</td>
<td>10000300</td>
<td>1000000</td>
</tr>
</table>
</div>
<table border="1px">
<tr>
<td width="100px">1000000</td>
<td>1000000</td>
<td>1000000</td>
</tr>
<tr>
<td>1000000</td>
<td>10000300</td>
<td>1000000</td>
</tr>
</table>
* {margin: 0; padding: 0;}
.div1 {position: relative; width: 150px; height: 100px; overflow: scroll; border: 1px solid red;}我們可以看到，類div1中的第一個單元格雖然設置了寬度，但是卻是無效的。單元格內容始終由內容而決定，那么既然是由內容決定的那么我們就想辦法讓“內容”把單元格撐開，這樣就行了。
我們可以在td中加個div，然后給div設置寬度，來試一下：
修改類div1中的一部分代碼：
<td width="100px" style="width: 100px !important;">1000800</td>
修改為
<td><div>1000800</div></td>
然后在樣式里寫入：
td div {
width:100px;
}看完了這篇文章，相信你對html中怎么解決表格單元格td設置寬度無效的問題有了一定的了解，想了解更多相關知識，歡迎關注億速云行業資訊頻道，感謝各位的閱讀！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
