自適應佈局：多套
自適應佈局是是爲了解決如何才能在不同大小的設備上呈現同樣的網頁;它的缺點是當屏幕縮放過小時,雖然能顯示但太過擁擠/不能夠自動適應調整網頁的佈局!
響應式網站：一套
響應式佈局就是爲了解決它的缺點而來的, 可以根據屏幕的縮放,不僅可以自動適應,還能自動調整頁面的佈局,使頁面更加的美觀;它可以自動識別屏幕寬度、並做出相應調整的網頁設計，佈局和展示的內容可能會有所變動! 比如一行中顯示6個圖片,當調整寬度爲之前的50%時,就會變成一行三個
響應式網站如何實現：
1.允許網頁寬度自動調整
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
2.儘量少使用絕對寬度
rem:可以設置字體和元素大小; 相對於根元素來說
em:設置字體大小; 相對於父級元素
百分比:
width:auto
3.圖片視頻自適應
img, object { max-width: 100%;}
4.或者可以引入寫好的庫:
像移動端佈局 flexble.js
5.一些UI框架自帶的響應式方法:
像element-ui ，bootstrap,layui