css首行缩进2个空格相对大小

最新推荐文章于 2024-07-03 18:00:13 发布

原创最新推荐文章于 2024-07-03 18:00:13 发布 · 1.3k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#css #text-indent #text-indent两个空格

HTML 同时被 2 个专栏收录

11 篇文章

订阅专栏

CSS

11 篇文章

订阅专栏

本文介绍了一种使用CSS的text-indent属性实现首行缩进的方法，并通过具体示例展示了如何设置首行缩进为当前字体大小的两倍。

有时候段落文本需要首行缩进两个空格，可以通过text-indent属性设置，单位em表示相对当前行文本大小缩进，例如当前文字大小是10px，那么2em就是相当于首行缩进了10xp*2=20px，也就是20px

<!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>Document</title>
    <style>
      
      p {
        font: italic 700 15px/20px 'Microsoft yahei';
        text-indent: 2em;
      }
    </style>
</head>
<body>
    <p>测试段落测试段落测试段落</p>

    
  
</body>
</html>