一、為什么要使用響應式設計？
我們想讓我們的網站通過響應用戶的行為、設備的屏幕大小和屏幕方向，從而在所有設備上都能用。
二、一個碎片化的世界
截止2013年，有成千上萬種不同的設備在瀏覽網頁，所以我們不可能設計出適應所有屏幕大小的網頁。相反，我們必須得采用一種更加流暢的方式去設計。
三、移動優先
最近一個比較火的詞叫移動優先。它的意思是，先為移動端設計樣式，然后再根據需求去優化更大屏幕的樣式。換句話說，假如你把移動端樣式當成網站的默認樣式，且以后不用去優化它，一步到位。那就更省事了！
四、用 Min-width 進行媒體查詢（ Media Queries ）
現在來介紹一種特別的布局方式。 通過 min-width 來界定不同屏幕該如何布局。它能就近檢測出不同設備的屏幕大小（即 media queries，可直譯為媒體查詢），比在樣式表末尾或一個單獨文件中處理更簡單。
1、不是所有瀏覽器生而平等
同一份 CSS，不同瀏覽器渲染出來的效果不一樣。為了避免出現這種情況，你可以使用類似 Normalize.css 這種更好的 CSS 來幫助你實現跨瀏覽器顯示。當然，你要把這份CSS放在你樣式表最前面。
2、在 Viewport 里加 Meta 標簽
在你 HTML 的<head> 代碼里添加 Meta 標簽。它可以使 media queries 在不同設備上起作用
3、CSS 盒模型
基礎很重要！在深入響應式設計之前，最好把像 HTML 元素如何在瀏覽器中生成并渲染這類知識搞清楚。CSS 盒模型由以下四部分組成。
新聞熱點
疑難解答
