:first-letter 伪元素 · CSS基础

## :first-letter 伪元素 ## 定义和用法 :first-letter选择器用来指定元素第一个字母的样式。 :first-letter是伪元素，它生成包含元素的第一个字母的伪元素。 :first-letter样式是元素的第一个字母。任何引导标点符号都应与第一个字母一起设置样式。在CSS2.1之前，:first-letter可以只附加到块级元素。CSS2.1扩展其范围，包括块，列表项，表调用，表标题和内联块元素。可以应用到首字母的属性是有限的。 **例子：** ~~~ h1:first-letter {font-size: 166%;} p:first-letter {text-decoration: underline;} ~~~ **提示:** :first-letter选择器可以使用以下属性： * font properties * color properties * background properties * margin properties * padding properties * border properties * text-decoration * vertical-align (only if float is 'none') * text-transform * line-height * float * clear **注意:** "first-letter" 选择器仅适用于在块级元素中. ## 实例--每个元素的第一个字母选择的样式： ``` <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>W3Cschool教程(w3cschool.cn)</title> <style> p:first-letter { font-size:200%; color:#8A2BE2; } </style> </head> <body> <h1>Welcome to My Homepage</h1> <p>My name is Donald.</p> <p>I live in Duckburg.</p> <p>My best friend is Mickey.</p> </body> </html> ```