7-2·100 css伪元素 首行改变样式颜色

 

    

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首行变样式</title>
    <style>
        p:first-line {
            color: #ff0000;
            font-variant: small-caps;
        }
        
        /* :first-letter 伪元素
"first-letter" 伪元素用于向文本的首字母设置特殊样式： */
        p:first-letter { 
            color: #2f00ff;
            font-size: xx-large;
        }
    </style>
</head>

<body>
    <p>你可以使用 "first-line" 伪元素向文本的首行设置特殊样式</p>
    <!-- <p>You can use the "first line" pseudo element to set a special style to the first line of text</p> -->
</body>

</html>

效果

   

 

posted @ 2022-02-08 16:12  优敏行  阅读(66)  评论(0)  编辑  收藏  举报