缩进text-indent标签造成图片也缩 进解决方案

  

今天在写小程序和h5前端时候为了内容的美观，进行文章的缩进标签，但是一发现，文字缩进了，图片也缩进了，造成了不美观，怎么解决？于是找了w3c文档，才发现text-indent的属性之一：就是其内部元素遇到float或者display:block后就不继承外部这个缩进的属性了。

 

   修改前样式：

 

 

 

 

 

  方案：只要给图片加上float或者display:block的CSS属性后，图片的缩进会自动失效。

 

例如：

1 2 3 4 5

.img{ display: block; margin-left: auto; margin-right: auto; }

 

或者：

1 2 3

.img{ margin:0 0 0 -30px; }

 

即可，加上之后的效果：

 

 

 

文章转自：http://www.kaotop.com/it/787619.html