:first-letter

优质

小牛编辑

127浏览

2023-12-01

描述 (Description)

:first-letter伪元素用于向文本的第一个字母添加特殊效果。

以下属性适用于此伪元素 -

字体属性
颜色属性
背景属性
保证金属性
填充属性
边境物业
text-decoration
vertical-align
text-transform
line-height
float
clear

例子 (Example)

下面是演示如何使用的示例:first-letter元素，用于向文档中元素的第一个字母添加特殊效果。

<html>
   <head>
      <style type = "text/css">
         p:first-letter { font-size: 3em; }
         p.normal:first-letter { font-size: 10px; }
      </style>
   </head>
   <body>
      <p class = "normal"> 
         First character of this paragraph will be normal and 
         will have font size 10 px;
      </p>
      <p>
         The first character of this paragraph will be 5em big and in red 
         color as defined in  the CSS rule above. Rest of the characters in 
         this paragraph will remain normal. This example shows how to use 
         :first-letter pseudo element to give effect to the first
         characters of any HTML element.
      </p>
   </body>
</html>

这将产生以下黑色链接 -