小程序样式课程-第8课-文本-text-indent缩进文本

p {text-indent: 5em;}

注意：一般来说，可以为所有块级元素应用 text-indent，但无法将该属性应用于行内元素，图像之类的替换元素上也无法应用 text-indent 属性。不过，如果一个块级元素（比如段落）的首行中有一个图像，它会随该行的其余文本移动。

p {text-indent: -5em;}

p {text-indent: -5em; padding-left: 5em;}

div {width: 500px;}

p {text-indent: 20%;}

<div>

<p>this is a paragragh</p>

</div>

div#outer {width: 500px;}

div#inner {text-indent: 10%;}

p {width: 200px;}

<div id="outer">

<div id="inner">some text. some text. some text.

<p>this is a paragragh.</p>

</div>

</div>

<view class='cls1'>

  文本内容（块级元素支持缩进）

</view>

<view >

  <text class='cls2'>文本内容(行内元素不支持缩进)</text>

</view>

<view class='cls3'>

  <text>文本内容（文本缩进）</text>

</view>

/*缩进文本*/

.cls1{

  text-indent: 2em

}

.cls2{

  text-indent: 2em;

  /*可以为所有块级元素应用 text-indent，但无法将该属性应用于行内元素*/

}

.cls3{

  text-indent: 2em;

}