rem的使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Rem Demo</title>
    <style>
       /*16px * 200%=32px*/
       /*一般将html的font-size设置为：20px或30px或50px或100px或62.5%;*/      
        @media screen and (min-width: 320px) {
            html {
                font-size: 20px;
            }
        }        
        @media screen and (min-width:750px) {
            html {
                font-size: 50px;
            }
        }
        body{
            font-size:0.5rem;          
        }
        h2{
            font-size:1rem;
        }
        .pp{
            font-size:2rem;
            width:50%;
            height: 3rem;
            background-color: red;
        }
        p{
            font-size:40%;           
        }
    </style>
</head>
<body>
    <h2>标题</h2>
    <div class="pp">
        <p>Abcd西安航天</p>
    </div>       
</body>
</html>

小结

待写...