css如何設定首行縮排2個字符-css教學-PHP中文網

css如何設定首行縮排2個字符

王林

發布： 2020-11-17 11:55:30

原創

10751 人瀏覽過

css設定首行縮排2個字元的方法：可以利用text-indent屬性來設定首行縮排2個字符，如【text-indent:2em;】。 text-index屬性用於規定文字區塊中首行文字的縮進，em是相對單位。

css如何設定首行縮排2個字符

相關屬性：

text-indent 屬性規定文字區塊中首行文字的縮排。

（影片教學建議：css影片教學）

屬性值：

length 定義固定的縮排。預設值：0。
% 定義基於父元素寬度的百分比的縮排。
inherit 規定應該從父元素繼承 text-indent 屬性的值。

實作程式碼：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>首行缩进</title>
        <style>
            .demo{
                width: 550px;
                height: 200px;
                margin: 50px auto;
            }
            p{
                text-indent:2em;/*em是相对单位，2em即现在一个字大小的两倍*/
            }
            }
        </style>
    </head>
    <body>
        <div class="demo">
        <p>
        这是一段测试代码，是关于css文本缩进的一段文字。这是一段测试代码，是关于css文本缩进的一段文字。
        这是一段测试代码，是关于css文本缩进的一段文字。这是一段测试代码，是关于css文本缩进的一段文字。
        这是一段测试代码，是关于css文本缩进的一段文字。这是一段测试代码，是关于css文本缩进的一段文字。
        </p>
        </div>
    </body>
</html>

登入後複製