rem與em的區別||結合使用rem與em
注意:谷歌瀏覽器最低支援的font-size為12px;
火狐和ie瀏覽器沒限制
rem:
作用:適用不同解析度的頁面
相對於根元素html;給html設定一個font-size;所有元素的長度單位都用rem(倍數關係),若html設定的font-size:10px;那麼2rem就是20px;
好處:不同解析度,只需要改變根元素html的font-size即可改變所有子元素的大小,且相對格局不變
em:
相對於父元素;給父元素設定font-size;該父元素下的所有子元素可以以em為單位來設定大小。
若父元素的font-size:10px;子元素設定2em即為20px;
頁面佈局中一般將rem和em結合
html{
font-size:10px
}
div{
width:10rem;//100px
height:10rem;//100px
//若不設定font-size則預設為html的10px
font-size :1.6rem//16px
}
div a{
font-size:2em//2倍父元素div的font-size的大小 32px
}
相關文章
- rem與em的使用和區別詳解REM
- em、rem、px、的區別REM
- 淺談px,em與remREM
- em 和 remREM
- css常用單位px、em、 rem 區別與各自的用法解析CSSREM
- px,em,rem,vw,vh之間的區別REM
- em,rem和vhREM
- px em rem 探討REM
- 深入理解CSS中em, rem, ex區別,及使用技巧CSSREM
- CSS px、em和rem單位CSSREM
- css中的px、em、rem 詳解CSSREM
- rem和em的用法,你弄懂了嗎?REM
- px、em和rem實戰經驗REM
- css3中單位px,em,rem,vh,vw,vmin,vmax的區別CSSS3REM
- CSS中PX與EM的區別CSS
- 【基礎】EM 還是 REM?這是一個問題!REM
- 說說css中pt、px、em、rem都扮演了什麼角色CSSREM
- CSS中px和em屬性的特點與區別CSS
- B,strong,I,em的區別
- css中單位 px、em 的區別CSS
- 微信小程式中rpx與rem單位使用微信小程式REM
- remREM
- oracle em與監聽改名的問題Oracle
- BE Remote Agent與Oracle EM埠衝突REMOracle
- 結合EM快速解決複雜的配置問題
- CSS remCSSREM
- 移動端配適與掌握動態 REMREM
- (EM演算法)The EM Algorithm演算法Go
- ORACLE 11G OCM備考之建立EM與EM登陸異常的處理Oracle
- 可愛的remREM
- 移動端使用rem原理REM
- 使用 rem 設計網頁REM網頁
- EM
- 關於佈局以及rem的小結REM
- 移動端自適應個人理解與收集——remREM
- 關於REMREM
- 動態REMREM
- rem佈局REM