手机端rem推荐的一种写法

来源：互联网发布：linux进入图形界面编辑：程序博客网时间：2024/04/28 15:59

:root {    font-size: 16px;}// Or you can use html// html {//    font-size: 16px;// }body {    font-size: 1rem;}button {    font-size: 0.875rem;    // All the internal/external value use in 'em'    // This value use of your "font-size" as the basic font size    // And you will not have any problem with the font size of the container ( Example bottom )    padding: .5em 1em;    border: .125em solid #e3e3e3;    @media (min-width: 48rem){ // min-width: 768px      font-size: 1.125rem;    }    @media (min-width: 62rem){ // min-width: 992px      font-size: 1.375rem;    }}// Example:.container {    // font-size: 14px;    font-size: .875rem;    width: 80rem;    button {        font-size: .875rem; // Still use font-size: 14px        padding: .5em 1em;        border: .125em solid #e3e3e3;        @media (min-width: 48rem){ // min-width: 768px          font-size: 1.125rem;        }        @media (min-width: 62rem){ // min-width: 992px          font-size: 1.375rem;        }    }}

0 0