rem筆記與移動web開發適配

rem原理與簡介

常見移動web適配方法

pc:

移動web:

media query **查詢

@media **型別 and

(**特性)

**特性：max-width，max-height…

rem(font size of the root element)

適配原理

相容性

1rem = 瀏覽器預設字型大小 (html的font-size)

修改font-size可以修改rem的大小

採用js調整rem

使用document.documentelement.clientwidth和document.body.clientwidth方法獲取裝置寬度

var 變數 = document.documentelement.clientwidth || 

document.body.clientwidth;

var 變數 = document.

getelementsbytagname
('html')[
0];變數.style.fontsize =
20px;

移動web開發適配秘籍Rem 1 1

一 移動web開發與適配 二 常見移動web適配方法 pc 移動web 注意 flex media query 會達到響應式布局的要求 三 media query 查詢 meadia 型別 and 特性 型別 screen,print 特性 max width max height meadia d...

移動web開發適配方案之Rem

移動端相對pc端來說大部分瀏覽器核心都是基於webkit的，所以大部分都支援css3的最新語法。但是由於手機的螢幕尺寸和解析度都不太一樣 尤其是安卓 所以不得不對不同解析度的手機做適配來達到近似的展示效果。一般來說，ui只會給我們提供乙份設計圖，目前比較多的是參考手機 的方案給乙份750px寬的設計...

移動WEB開發之rem適配布局

rem單位 rem root em 是乙個相對單位，類似於em，em是父元素字型大小。不同的是rem的基準是相對於html元素的字型大小。比如，根元素 html 設定font size 12px 非根元素設定width 2rem 則換成px表示就是24px 2.1 查詢 查詢 media query...