我正在處理這樣的html css代碼，以便我的表格有一個帶有影像的單元格
.illustration_tr {
top: opx;
left: 0px;
width: 512px;
height: 288px;
background: #eaeaea 0% 0% no-repeat padding-box;
border-radius: 4px;
opacity: 1;
}
.illustration_td {
max-height: 100%;
max-width: 100%;
overflow: clip;
} <tr class="illustration_tr" id="illustration_tr">
<td>
<img class="illustration_td" id="illustration_td" src="https://cdn.pixabay.com/photo/2022/04/18/02/24/architecture-7139263_1280.jpg" />
</td>
</td>最終的形象是這樣的。如果您看到它在 chrome 除錯器中顯示 512 x 341，這不是我想要的。我怎樣才能讓它明確地符合我的 512 x 288 規格
uj5u.com熱心網友回復：
使用這個 CSS 代碼
.illustration_tr {
top: 0px;
left: 0px;
background: #eaeaea 0% 0% no-repeat padding-box;
border-radius: 4px;
opacity: 1;
}
.illustration_td {
width: 512px;
height: 288px;
overflow: clip;
}
uj5u.com熱心網友回復：
嘗試設定
max-width: 512px; !important
和
width: 512px;
這樣影像就不能大于 512px。
但是，如果確實如此，則意味著在您的代碼中的某處存在使圖片變大的東西（最有可能是一些非常量的大小）。
uj5u.com熱心網友回復：
試試這個：
.illustration_table {
border-spacing:0;
}
.illustration_td {
width: 512px;
height: 288px;
background: #eaeaea 0% 0% no-repeat padding-box;
border-radius: 4px;
opacity: 1;
background: red;
display: flex;
padding: 0;
}
.illustration_td img {
width:100%;
height: 100%;
overflow: clip;
}<table class="illustration_table" cellspacing="0">
<tr class="illustration_tr" id="illustration_tr">
<td class="illustration_td" id="illustration_td">
<img src="https://cdn.pixabay.com/photo/2022/04/18/02/24/architecture-7139263_1280.jpg" />
</td>
</tr>
</table>更新
td將from的顯示屬性更改display: table-cell為display: flex洗掉空格
uj5u.com熱心網友回復：
您可以進入繪畫并更新影像的大小，例如。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/465715.html