響應(yīng)式簡介

1. 前言

響應(yīng)式就是一個網(wǎng)站能夠兼容多個終端，而不是為每個終端做一個特定的版本，這個概念是為解決移動互聯(lián)網(wǎng)瀏覽而誕生的。

無論你的屏幕多大，小一點的屏幕(手機)可以一行行的排列，中等一點的屏幕(平板電腦)可以兩列三列的那么排布，更大的屏幕(PC電腦)則可以展示更多的列，因為電腦屏幕的寬高比恰巧與手機相反嘛(寬比高大)。

2. 響應(yīng)式布局

響應(yīng)式布局通常分為三種：

• 一種是利用彈性盒子Flex、網(wǎng)格布局Grid或左浮動法Float等 CSS 屬性來實現(xiàn)的在一列上根據(jù)屏幕大小的不同而進行自動換行。

• 另一種是利用媒體查詢來根據(jù)當(dāng)前屏幕大小來運行相應(yīng)的 CSS 代碼。

• 還有一種是利用 JavaScript 來獲取窗口寬高來動態(tài)操作 DOM 元素。

本章我們將重點講解前兩種，因為《移動端布局》這門課是從《CSS 布局》這門課程中拆分出來的，所以能不用 JavaScript 就盡量不用 JavaScript。

由于漸隱漸現(xiàn)那兩小節(jié)必須要獲取到屏幕滾動的位置才可以做得到
而且不想讓同學(xué)們錯過比較常見的這么一種需求
所以才不得已的用到了一點點的 JavaScript

3. 小結(jié)

響應(yīng)式布局非常適合那種想要在各種不同設(shè)備上都能夠流暢顯示的網(wǎng)站。

響應(yīng)式的使命就是：一套代碼 四處運行