css如何让段落开头预留两个空格

2025-04-19 11:47:06

1、首先我们随便创秃赈沙嚣建一个简单的网页,页面就只有两个段落,然后里面是一大串文字。如下:<html><head><meta ch锾攒揉敫arset="utf-8"><style>div{letter-spacing:1em;}</style></head><body><p>我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1</p><p>我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2</p></body></html>

css如何让段落开头预留两个空格

2、然后我们运行在浏览器里面看下具体效果,可以看到,在默认情况下,段落中的每段文字都是对齐了的,也就是第一行并没有先出现两个空格。

css如何让段落开头预留两个空格

3、那么,这是我们怎么解决呢?其实很简单,只酋篚靶高需要添加一个text-indent样式即可。text-indent 属性规定文本块中首行文眺螗熨膣本的缩进。如:text-indent:2em;完整代码如下:<html><head><meta charset="utf-8"><style>p{text-indent:2em;}</style></head><body ><p>我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1</p><p>我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2</p></body></html>

css如何让段落开头预留两个空格

4、查看运行结果如下,可以看到,此时段落都在首行出现了缩进,也就是出现了预留空格,这个很好我们平常看到的段落就非常相似了。^_^

css如何让段落开头预留两个空格

5、上面的单位用的是em,殂翼瑟擀实际上也可以用绝对单位px,当然如果你要进行响应式网页开发的话,还是建议用em,不过有时就会出现特殊需求,需要用px的,下面是一个px作为单位的演示:<html><head><meta charset="utf-8"><style>p{text-indent:30px;}</style></head><body ><p>我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1我是段落1</p><p>我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2我是段落2</p></body></html>

css如何让段落开头预留两个空格

6、效果如下所示,可以看到效果和用em设置的差不多,但是em只用了2个,而px却用了30个。。。差距还是有点大,好了,用px做单位了解下就好了,平常还是用em就好。

css如何让段落开头预留两个空格

7、关于浏览器兼容问题:几乎所有的浏览器都是支持这个属性的,所以可以放心使用^_^

css如何让段落开头预留两个空格
声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢