用JS調(diào)制屏幕大小1CSS 方面去掉所有元素的外間距內(nèi)邊距，html 和 body 寬高設(shè)為 100%，canvas 元素 display 設(shè)為 block2JS 方面監(jiān)聽(tīng)窗口的 resize 事件，在窗口大小改變的同時(shí)調(diào)整 canvas 的大小3完整代碼這里我們使用 jQuery 來(lái)處理窗口尺寸改變事件響應(yīng)，以及屬性設(shè)置4同時(shí)使用 $。

1，輸入positionfixedtop0left0將整個(gè)div固定在屏幕的頂部和左側(cè)2輸入width100％height100％min－width1000px這個(gè)可以適合div的高度和寬度，而min－width是為了實(shí)現(xiàn)讓屏幕寬度在1000px以?xún)?nèi)時(shí)，div的大小保持不變3輸入backgroundsize coverwebkitbackgroundsize。

通過(guò)這個(gè)監(jiān)控屏幕大小，等屏幕大小改變，則替換成另一個(gè)樣式media screen and maxwidth 480px 設(shè)置手機(jī)屏寬度不大于 480px時(shí)的樣式 divMain 想在手機(jī)屏上更改的樣式 float widthauto divSidebar 想在手機(jī)屏上更改的樣式 display。

逗自適應(yīng)網(wǎng)頁(yè)設(shè)計(jì)地的核心，就是CSS3引入的 Media Query模塊它的意思就是，自動(dòng)探測(cè)屏幕寬度，然后加載相應(yīng)的CSS文件上面的代碼意思是，如果屏幕寬度小于400像素maxdevicewidth 400px，就加載tinyScreencss文件如果屏幕寬度在400像素到600像素之間，則加載smallScreencss文件除了用html標(biāo)簽。

用JavaScript或者jquery 1頁(yè)面加載完，獲取當(dāng)前瀏覽器顯示區(qū)域高度2獲取頁(yè)面中我的相冊(cè)div1關(guān)閉相冊(cè)的高度3用1獲取的值減去2所有的值4用3所得值附加給div2 好了，方法教給你了，自己去實(shí)現(xiàn)吧。

2打開(kāi)HTML文件所在的文件夾，雙擊文件，跳轉(zhuǎn)到瀏覽器 3改變?yōu)g覽器大小，發(fā)現(xiàn)圖片沒(méi)有變化，顯示不全 4在所在文件夾下，新建一個(gè)樣式文件，命名為 autocss，代碼如下 5在HTML文件中加上對(duì)樣式文件的引用，返回文件夾，雙擊HTML文件，發(fā)現(xiàn)瀏覽器的變化會(huì)引著圖片一起變化，自適應(yīng)屏幕的大小 工。