什麼是響應式布局設計？ |

【JJ Ying的回答(36票)】:

很久很久很久以前，每個人都只有一件衣服（ Website），不管你有錢沒錢大家每天都只穿這一件。

後來有人發明了舞會（移動互聯網），大家都爭先恐後地想要參加，於是一個做「開發」的裁縫忽悠人們說進舞會最好訂做一件專門的禮服（ Mobile Site ），大家想想也對，上班和出去哈皮都穿同一件衣服多無聊啊，舞會就要有舞會的樣子。於是乎只要有點閑錢的人都做了禮服，他和原來那件叫做 Website 的衣服是完全不一樣的，面子不一樣，里子也不一樣。

後來舞會的種類越來越多了，很多人被迫做了好多好多件禮服，於是又有一個叫做「前端」的裁縫站出來說你們每年要新做那麼多衣服，多費錢啊，而且一出門鑰匙啊皮夾子啊名片都要在不同衣服里換來換去多麻煩。你看，我們新發明了一個手藝叫做「Responsive Design」，只要把你原來那件衣服稍微那麼一改，以後去哪個舞會都可以只穿這一件衣服，衣服的里子永遠都差不多，但面子可以按照要求自適應不同的舞會。

於是所有人都開始換上這種響應式的衣服了。。。

【劉凱的回答(2票)】:

在PC上你看的網站可能是這樣的:

在小屏幕或平板上你看到的網站可能是這樣的:

響應式布局就是根據屏幕大小自動布局.

【傑夫的回答(0票)】:

通俗得講是：css根據屏幕寬度，自動調整網頁div顯示和布局，以適應不同尺寸屏幕優化瀏覽體驗。

【myersguo的回答(0票)】:

看一個例子：Mashable 的首頁：

瀏覽器窗口最大化時：

縮小瀏覽器窗口：

再縮小：

再縮小：

以上。

原文地址:http://www.zhihu.com/question/20976405