解釋響應(yīng)式布局？

1.原生代碼實現(xiàn)。

在國內(nèi)目前設(shè)計網(wǎng)頁的時候，一般會分成PC端和移動端兩套頁面，但在一定的情況下，必須滿足只設(shè)計一個頁面的情況下，滿足不同端口都能正常使用，

因此會用用到自適應(yīng)的方法。

用原生代碼實現(xiàn)的根本在于媒體查詢@media的設(shè)置。

@media screen 可以查詢當(dāng)前瀏覽器的尺寸，因此可采用該方法對同一個頁面設(shè)置不同的CSS樣式，來滿足不同分辨率要求。

2.采用bootstrap框架布局

bootstrap框架布局完成的頁面，是自動對應(yīng)的自適應(yīng)效果。

但是在書寫的時候，應(yīng)該嚴(yán)格按照bootstrap的書寫規(guī)范，才不會出現(xiàn)怪異性問題。

寫法舉例：

說明：最后的數(shù)字對應(yīng)該div所占柵欄的列數(shù)。

col-md-6 代表在PC端上顯示在一行的6個柵欄，也就是一半。

col-sm-6 代表在平板上也顯示div占當(dāng)前行的一半。

col-xs-12 代表在手機(jī)端顯示為當(dāng)前行的百分之百填充。

3.還有其他方式，如JQuery和專門做響應(yīng)式的JS文件，比如nicebox均能實現(xiàn)自適應(yīng)效果，實現(xiàn)響應(yīng)式布局。