每天學習一點知識,讓工作與生活更精彩
當前位置:首頁 » 網站資訊 » 永康js如何製作響應式網站
擴展閱讀
更改計算機網路 2025-02-28 15:08:35

永康js如何製作響應式網站

發布時間: 2023-09-25 02:21:27

Ⅰ 做好的網頁怎樣簡單快速的實現響應式

首先在寫頁面的時候就要為響應式網頁做准備,寬使用百分百,不設置固定高度。
設置meta 進行適應移動端頁面。
了解pc 端主流顯示器解析度,設置顯示斷點,例如1920 * 1080 通過媒體查詢設置 1920 寬度的顯示方式,1600*1200,設置 1600寬度的顯示方式,其實一般是1200 以上的都設置同一個顯示方式就可以了,主要是顯示器解析度低的,例如 800 * 600 設置它的顯示方式,
xs: 576px sn:≥576px md: ≥768px lg:≥992px xl:≥1200px xxl:≥1600px
一般需要通過媒體查詢設置的pc端的范圍有這些。
移動端的話一般不是通過媒體查詢來設置, 先用 js 將單位設置為 rem, 即 1rem = 100px
這樣則 默認字體為 0.16rem; 通過百分百寬度來設置盒子的寬,讓它根據屏幕來做調整。
如果使用框架的話還可以結合 柵格系統來做響應式兼容。
其實移動端的兼容是最麻煩的,因為手機品牌種類多,系統一般分 安卓 和 ios ,但是還有系統版本,問題,不同系統版本也會有不一樣的顯示方式(特別是ios系統)。
安卓主要是品牌種類的不同,屏幕 解析度的不同。

想要做基本的兼容就是先設置meta,然後將寬設置為 百分百比