京东初始化主要的CSS

我的CSS苦逼学习日记(10)

* {
     
            margin: 0;
            padding: 0
        }

        em,
        i {
     
            font-style: normal
        }

        li {
     
            list-style: none
        }

        img {
     
            border: 0;
            vertical-align: middle
        }

        button {
     
            cursor: pointer
        }

        a {
     
            color: #666;
            text-decoration: none
        }

        a:hover {
     
            color: #c81623
        }

        button,
        input {
     
            /* "\5B8B\4F53" 就是宋体的意思 这样浏览器兼容比较好 */
            font-family: Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif
        }

        body {
     
            /* 抗锯齿性 让文字显示更加清晰 */
            -webkit-font-smoothing: antialiased;
            background-color: #fff;
            font: 12px/1.5 Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif;
            color: #666
        }

        .hide,
        .none {
     
            display: none
        }

        .clearfix:after {
     
            visibility: hidden;
            clear: both;
            display: block;
            content: ".";
            height: 0
        }

        .clearfix {
     
            *zoom: 1
        }

淘宝清除边距方法:

        body,
        dl,
        dd,
        ul,
        ol,
        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        pre,
        form,
        fieldset,
        legend,
        input,
        textarea,
        p,
        blockquote,
        figure,
        hr,
        menu,
        dir,
        thead,
        tbody,
        tfoot,
        th,
        td {
     
            margin: 0;
            padding: 0
        }

对比

两种不同的方法,更推荐 淘宝 的这种清除内外边距的方法,因为有些东西不需要清除内外边距

你可能感兴趣的:(CSS,前端学习)