響應(yīng)式Web設(shè)計是關(guān)于使用HTML和CSS自動調(diào)整，隱藏樟凄，縮小或放大網(wǎng)站的大小聘芜，以使得它在所有設(shè)備（臺式機(jī)、平板電腦和手機(jī)）上看起來都有很合適的效果顯示缝龄。
關(guān)于響應(yīng)式網(wǎng)頁設(shè)計我們需要了解幾個概念：
-
什么是響應(yīng)式網(wǎng)頁設(shè)計
RWD（Responsive Web Design）汰现，可以使我們的網(wǎng)頁在任何設(shè)備上都是美觀好看的挂谍，僅僅使用HTML和CSS，它不是程序或者是JavaScript瞎饲。
-
什么是視窗
指的是用戶在網(wǎng)頁上的可見區(qū)域口叙。
-
什么是網(wǎng)格視圖
是指更進(jìn)一步檢查細(xì)節(jié)的最佳模式。
-
什么是媒體查詢
媒介查詢是CSS3中引入的CSS技術(shù)嗅战。
設(shè)置視窗
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
viewport 元素為瀏覽器提供有關(guān)如何控制頁面尺寸和縮放放的說明妄田；
width=device-width 部分將頁面寬度設(shè)置為遵循設(shè)備的屏幕寬度；
initial-scale=1.0 部分設(shè)置瀏覽器首次加載頁面時的初始縮放級別驮捍。
不同尺寸下的響應(yīng)式布局效果圖：
responsive3.png
responsive2.png
responsive1.png
