美文网首页马文的地下室
学习笔记《DIV+CSS》

学习笔记《DIV+CSS》

作者: 马文Marvin | 来源:发表于2016-10-14 17:42 被阅读14次

    页面命名:

    <div class="cf3-nav"></div>
    <div class="cf3-container"></div>
    <div class="cf3-footer"></div>
    

    整个页面的居中:

    #nav {margin:0px auto; width:1200px}
    #container, #footer {margin:0px auto; width:1440px}
    

    字体:

    body {font-family:PingFangSC-Regular, "Microsoft YaHei", sans-serif;}
    

    链接样式的处理:

    a:link { text-decoration: none;color: blue}
    a:active { text-decoration:blink}
    a:hover { text-decoration:none;color: red}
    a:visited { text-decoration: none;color: blue}
    

    奇偶间隔显示的伪类:

    .cf2-like-product-item:nth-child(2n) .cf2-like-product-item-bottom {background:#fc6605;}
    .cf2-like-product-item:nth-child(2n) .cf2-like-product-item-title {color:#fc6605;}
    

    Margin Border & Padding:


    字符串截取:

    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    

    扩展阅读:http://stackoverflow.com/questions/20792639/how-to-display-only-the-first-few-lines-of-a-div-clamping

    相关文章

      网友评论

        本文标题:学习笔记《DIV+CSS》

        本文链接:https://www.haomeiwen.com/subject/gzdwyttx.html