這個問題在這里已經有了答案： 在 HTML 中設定影像尺寸 2 個回答 59 分鐘前關閉。
為 IMG 元素顯式定義寬度和高度屬性有什么好處？我可以通過 CSS 將寬度設定為 100%，除非我通過 CSS 明確設定高度，否則影像元素將保留固有的縱橫比。相反，我可以在 HTML 標記中定義寬度和高度屬性并省略 CSS 宣告，影像將僅以這些顯式尺寸呈現。如果您打算隨后通過 CSS 將寬度設定為 100%，為什么要在 HTML 中設定暗淡？
uj5u.com熱心網友回復：
有人可能有更好的答案，但也許是為了提供更多的功能......你仍然可以使用我理解的 object-fit 來保留縱橫比。
uj5u.com熱心網友回復：
Google 建議設定影像大小以避免 CLS（累積布局偏移）。閱讀更多https://web.dev/cls/
uj5u.com熱心網友回復：
width 和 height 屬性被賦予了新的生命——它們可以被設定并隨后用于設定被替換元素的 CSS 縱橫比。這有助于避免瀏覽器在加載之前調整大小的問題。
請參閱MDN以獲得更完整的解釋，特別是：
本文解釋了在 Web 檔案上設定寬度和高度屬性時，在其上計算尺寸的方式發生的變化。
此更改意味著影像的縱橫比由瀏覽器早期計算，然后可用于在加載之前校正顯示影像所需的大小
您可以通過以下方式在 CSS 中設定縱橫比：
aspect-ratio: attr(width) / attr(height);
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/329450.html
下一篇：從動態陣列接收值