其屏幕適配方面并不比原生態(tài)代碼簡單。下面給大家分享下我總結出來的H5界面適配：
一、Media Queries
網上一搜一大把的一個方式MediaQueries，在CSS中寫下不同屏幕下使用不同的CSS來實現屏幕適配，這個方式不但可以進行字體的適配還能實現不同界面顯示不同的樣式：
1：CSS中根據要求寫不同的屏幕范圍，如下:
@media screen and (min-width: 240px) and(max-width:319px){
html {font-size: 10px; }
}
2：HTML代碼頭部添加下面一段：
<meta name="viewport"content="width=device-width, initial-scale=1, maximum-scale=1.0,user-scalable=no;" />
這里的各項參數所代表的意思可以另行百度。
這種方式跟android中通過多個drawable、layout、value文件夾各自編寫XML界面的方式相同。

二、em和rem的使用
避免px單位的使用是個很重要的一點。這里用em和rem來代替px。
em：根據父標簽的字體大小來設置當前標簽的寬高或字體大小。如：
<div id=”a”>
<div id=”b”></div>