1打開HTML5網(wǎng)頁代碼2在網(wǎng)頁頭部加上新代碼，讓網(wǎng)頁的寬度自適應設備的寬度代碼如下ltmeta name=quotviewportquot content=quotwidth=devicewidth initialscale=10 maximumscale=10 minimumscale=10 userscalable=noquot 3在輸入代碼完成后，把圖片包括圖片DIV 的寬度設置成百分之百即可。

本文將詳細介紹HTML中圖片如何適應屏幕的不同方法首先，將圖片作為div背景，使用backgroundposition設置為center norepeat，能確保圖片自適應屏幕且無橫向滾動條，如`backgroundurlimg1jpg center norepeat`另一種方式是設置圖片的backgroundsize為100% 100%，使其在msg_desc元素中占。

在網(wǎng)頁開發(fā)中，確保圖片在不同尺寸的屏幕上都能顯示最佳效果是一項重要任務為了實現(xiàn)這一目標，可以使用HTML5和CSS3中的相關(guān)特性來讓圖片自適應屏幕寬度首先，確保你已經(jīng)安裝了瀏覽器和文本編輯器，這是進行開發(fā)的基礎工具接下來，詳細步驟如下首先，創(chuàng)建一個新的HTML文件，并為其命名然后，在。

用CSS3 @media 查詢 也叫“媒體查詢”語法aaawidth1200px 正常樣式 下面是分辨率最小為300px，最大分辨率為1024px的樣式 media screen and minwidth 300px and maxwidth1024px aaawidth375px 可以參考菜鳥教程CSS3 @media 查詢。

html5中是通過css3的backgroundsize來控制自適應的backgroundsize神奇之處就在于它的自我調(diào)整能力我以前常常擔心當瀏覽器窗口發(fā)生變化，當有resize事件發(fā)生時，頁面會出現(xiàn)不可預測的變化但backgroundsize卻能根據(jù)客戶端瀏覽器的大小自我的調(diào)整適應backgroundsize在火狐瀏覽器， Safari瀏覽器。