css中first-letter是什么

::first-letter 伪元素用于选中块级元素第一行的首字母并设置样式，常用于实现首字下沉效果，支持字体、颜色、背景、边距及浮动等样式设置，需注意仅作用于块级元素，首字符为标点或数字时部分浏览器可能识别异常，中文环境下可正常应用。

first-letter 是 CSS 中的一个伪元素，用来选中一个块级元素中第一行的第一个字母，并对其单独设置样式。这个伪元素常用于实现“首字下沉”效果，在杂志或排版精美的网页中很常见。

基本语法

使用方法是在选择器后加上 ::first-letter（注意是双冒号，表示伪元素）：

p::first-letter {
  font-size: 2em;
  float: left;
  color: red;
}

可以设置的样式属性

通过 ::first-letter 可以应用多种CSS样式，包括：

• 字体相关：如 font-size、font-weight、font-style
• 颜色和背景：color、background、background-color
• 边距和填充：margin、padding
• 浮动和布局：float、line-height

使用注意事项

并不是所有情况下都能正确触发 ::first-letter，需要注意以下几点：

• 必须作用于块级元素（如 p、div、h1 等），内联元素无效
• 如果第一个字符是标点符号或空格，有些浏览器可能不会正确识别
• 数字开头的内容也会被识别，比如 "2025年" 中的 "2" 会被当作首字母
• 配合中文使用时，能正常对汉字起效，比如让第一个汉字变大

基本上就这些，用好 ::first-letter 能让你的文本排版更有设计感，特别适合文章开头的装饰性处理。不复杂但容易忽略细节。