0011-伪元素选择器-前端学习笔记 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
    /*
    *伪元素
    *为p段落中的第一个字符设置一个特殊样式
    */
    
        p:first-letter{
            color:red;
            font-size:20px;
        }
    /*为p中的第一行设置一个背景颜色为黄色*/
        p:first-line{
            background-color:yellow;
        }

    /* 为p元素的最前面和最后面添加一些内容，配合content使用*/
        p:before{
            content:"我会出现在整个段落的最前面";
            color:green;
        }
        p:after{
            content:"我会出现在整个段落的最后面";
            color:purple;
        }


    </style>



</head>
<body>
    <p>
    我是一个段落
</p>
</body>
</html>

我是一个段落

posted @ 2018-04-05 16:40  Karlkaijie  阅读(104)  评论(0)    收藏  举报