建站小技巧,利用css进行首行缩进2个字符设置

发布时间:2022-05-13 16:51:36 作者: 来源: 浏览量(2353 )
摘要:css设置首行缩进2个字符的方法:可以利用text-indent属性来设置首行缩进2个字符,如【text-indent:2em;】。text-index属性用于规定文本块中首行文本的缩进,em是相对单位。 相关属性: text-indent 属性规定文本块中...

css设置首行缩进2个字符的方法:可以利用text-indent属性来设置首行缩进2个字符,如【text-indent:2em;】。text-index属性用于规定文本块中首行文本的缩进,em是相对单位。

相关属性:

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>

 

扫一扫二维码,直接手机访问此页

扫码访问手机页面

【免责声明】本网站的部分文章信息(文字、图片、音频视频文件等资源)来自于网络,均是为公众传播有益咨询信息之目的,其版权归版权所有人所有。 本站采用的非本站原创文章及图片等内容无法一一与版权者联系,如果本站所选内容的文章作者及编辑认为其作品不宜供大家浏览,或不应无偿使用, 请及时联系我们删除,同时向您深表歉意!请发送邮件153462496@qq.com进行联系。

感兴趣吗?

欢迎联系我们,我们愿意为您解答任何有关网站疑难问题!

在线客服
嘿,我来帮您!