语法

initial-letter: normal | <number> | <integer>;

首字母属性示例:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      body {
        display: flex;
        align-items: center;
        justify-content: center;
        font-family: 'Slabo 27px';
        font-size: 1.5em;
        line-height: 1.5;
        padding: 40px 0;
      }
      article {
        width: 80%;
      }
      .example::first-letter {
        -webkit-initial-letter: 2;
        initial-letter: 1;
        color: #8ebf42;
        font-weight: bold;
        margin-right: .60em;
      }
    </style>
  </head>
  <body>
    <article class="example">
      生活本就是矛盾的,白天与黑夜间的距离,春夏秋冬之间的轮回,于是有了挑剔的喜爱,让无奈加上了喜悦的等待。
是谁把光阴剪成了烟花,一瞬间,看尽繁华。是谁把思念翻起了浪花,一转身,浪迹天涯。

    </article>
  </body>
</html>

CSS initial-letter 属性值说明

描述
normal没有初始字母效果。这是此属性的默认值。
<number>指定首字母的大小,它占用了多少行。不允许使用负值。
<integer>指定初始字母应沉没的线条数。
initial使属性使用其默认值。
inherit从父母元素继承属性。
CSS 首字母属性initial-letter

initial-letter 属性指定第一个字母和它占用的行数。

此属性出现在首字母大于其余内容的报纸中。

此属性具有三个值:normal、<number>、<integer>。

不允许使用负值。

只有 Safari 支持此属性。

初始值普通的
应用于::first-letter伪元素 以及块容器的第一个内联级的子元素
继承无效
可动画的无效
版本CSS3.
DOM 语法Object.Style.Initialletter = "<数字>"
日期:2020-06-02 22:14:35 来源:oir作者:oir