因此即使瀏覽器只有HTML，它仍然能夠分配適當的空間。所以我們可以修改成以下內容：

最近我們發現谷歌瀏覽器對圖片設置有一定的修改，它主要在圖像上進行設置width和設置height屬性，以防止布局發生變化并改善網站訪問者的體驗。

Web性能倡導者經常建議開發者為圖像添加尺寸，以實現最佳性能，以便在下載圖像本身之前，以適當的圖像空間布置頁面，這樣可以避免下載圖像時發生版式移位。

為什么說給圖片設置寬度和高度是一個很好的建議呢？

一下圖是簡單例子：

h1>Your titleh1>

Introductory paragraph.p>

Lorem ipsum dolor sit amet, consectetur…p>

以上例子分兩個階段進行渲染，首先是在下載HTML，然后再下載圖像。使用上面的代碼，這將導致主要內容在下載圖像后發生加載版式移位。

圖片未加載不留位置

布局的變化對用戶造成很大的干擾，尤其是如果你已經開始閱讀文章，突然被一連串的動蕩甩開了，然后你必須再次找到自己的位置。當每個圖像都通過Internet到達時，這還會在瀏覽器上進行額外的工作以重新計算頁面布局。在包含大量圖像的復雜頁面上，這可能會在設備上要處理很多更好的事情時給設備帶來可觀的負擔！

避免這種情況的傳統方法是在標記中提供width和height屬性，

Your titleh1>

Introductory paragraph.p>

Lorem ipsum dolor sit amet, consectetur…p>

然后進行渲染，如下所示，在到達圖像時為圖像留出適當的空間，并且下載圖像時文本不會發生劇烈的偏移：

預留空間給圖像

頁面內容不斷跳動對用戶造成煩人的影響，更是對服務器的CPU影響相當大，所以在頁面需要加載圖片時，可以考慮添加高寬度。

總結

以上是生活随笔為你收集整理的html设置页面的高度和宽度,web显示页面有图像上设置高度和宽度很重要的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。