響應(yīng)式布局簡單點說，就是做一個網(wǎng)站同時能兼容多個終端，由一個網(wǎng)站轉(zhuǎn)變成多個網(wǎng)站，為我們大大節(jié)省了資源那么響應(yīng)式布局的優(yōu)點和缺點又有哪些呢優(yōu)點1面對不同分辨率設(shè)備靈活性強(qiáng) 2能夠快捷解決多設(shè)備顯示適應(yīng)問題 缺點不能完全兼容所有瀏覽器，代碼累贅，加載時間加長說了這么多，可能還有。

響應(yīng)式Web設(shè)計的方法 介紹完響應(yīng)式Web的背景和概念之后，是時候該介紹具體的實現(xiàn)方法了，其實響應(yīng)式Web設(shè)計的方法很簡單，就是利用CSS3的媒體查詢Media Queries和Viewport來解決問題的首先我們一起來看看Media Queries，這里我只會對其做一個簡單的列舉介紹通過媒體查詢的設(shè)置，我們可以根據(jù)屏幕寬度屏幕。

什么是H5響應(yīng)式布局？代碼什么的，不方便理解簡單說來，幾年前，我們?yōu)閷崿F(xiàn)移動端和PC端網(wǎng)頁相同的呈現(xiàn)效果，需要開發(fā)兩個單獨的網(wǎng)站響應(yīng)式布局的出現(xiàn)，能幫我們實現(xiàn)“一次設(shè)計，普遍適用”的效果，網(wǎng)頁根據(jù)終端自動調(diào)整頁面和圖片布局H5響應(yīng)式布局就是在不同終端呈現(xiàn)相同的動態(tài)頁面，為用戶提供更舒適。

響應(yīng)式布局，說直白點就是一個網(wǎng)站能夠兼容多個終端，可以按不同的分辨率顯示不同的狀態(tài)而實現(xiàn)這個就要用到css3的Media Queries媒介查詢這個功能非常的強(qiáng)大，但是有優(yōu)點的同時，缺點也是會存在的那就是兼容各種設(shè)備工作量大，效率低下，加載時間長等但是學(xué)起來很容易，看完下面的代碼你就會了。

實現(xiàn)原理代碼thead floatleft tbody displayblockwidthautooverfloauto二響應(yīng)式內(nèi)容1響應(yīng)式圖片帶寬是手機(jī)終端的硬傷，如果我們只是頁面布局做了響應(yīng)式處理，在我們用手機(jī)訪問時，請求的圖片還是PC上的大圖文件體積大，消耗流量多，請求延時長，因此導(dǎo)致的問題也是不可估量的那么我們就得把圖片。

#160#160#160同彈性布局類似，可以適應(yīng)一定范圍內(nèi)所有尺寸的設(shè)備屏幕及瀏覽器寬度，并能完美利用有效空間展現(xiàn)最佳效果只是混合像素和百分比兩種單位作為頁面單位可切換的固定布局彈性布局混合布局都是目前可被采用的響應(yīng)式布局方式其中可切換的固定布局的實現(xiàn)成本最低，但拓展性比較差。

移動端實現(xiàn) web 頁面的響應(yīng)式，可以使用 CSS3 中的媒體查詢Media Queries媒體查詢可以根據(jù)不同的設(shè)備屏幕尺寸，應(yīng)用不同的樣式規(guī)則，從而實現(xiàn)響應(yīng)式布局例如，可以使用 maxwidthminwidthmaxheightminheight 等屬性來設(shè)置元素的最大最小寬度或高度，以適應(yīng)不同設(shè)備的屏幕尺寸另外。