icon font 和媒体查询的运用 -

<link rel="stylesheet" href="//at.alicdn.com/t/c/font_3927980_xjos8pca4.css">
<style>
    .iconfont {
        font-family: "iconfont" !important;
        font-size: 50px;
        font-style: normal;
        -webkit-font-smoothing: antialiased;
        -webkit-text-stroke-width: 0.2px;
        -moz-osx-font-smoothing: grayscale;
    }
    @media screen and (min-width:1200px) {
        /* 根据屏幕不同宽度 显示不同内容 就叫响应式 */
        /* 当屏幕宽度大于1200px */
        body {
            background-color: red;
        }
    }
    @media screen and (max-width:1199px) and (min-width:800px) {
        body {
            background-color: blue;
        }
    }
    @media screen and (max-width:799px) {
        body {
            background-color: brown;
        }
    }
</style>
</head>