Question

CSS中，P设定为text-indent:2em;但，我想当P img时，P的text-indent能够取消

p {
line-height: 2em;
text-indent: 2em;
font-size: 14px;
font-style: normal;
}

当<p><img src="test.jpg" /></p>时，不希望图片也低两格。请问，怎么实现？

Answer 1

提问者采纳的完全是错的，你们确定实验过？

另外楼下jquery方法略显复杂。

更好的办法是，p里的img都负边距2em

p img{margin-left: -2em;}

这个不要定义全局，只定义到文章内容哪里就可以。

负边距不兼容IE6，可以加个相对定位的hack。

Answer 2

楼主单独为 p中出现了图片的元素定义样式就是了

p img {
	text-indent: 0;
}

不过不建议楼主这样去写样式

 p {
    line-height: 2em;
    text-indent: 2em;
    font-size: 14px;
    font-style: normal;
}

弊端太多，网站建设中要用到各种各样的段落显示，并且<p>元素并不仅是显示段落，更多时候我们也把他当做块元素用，楼主这样用 你定义在P元素中的样式属性会影响到网页或网站中所有的P元素，在真正开发中会导致各种各样的问题，当然你只做一个页面除外。

我们最好不要直接给 页面元素定义太多样式

正确的定义方法 字体大小，字体样式，行高定义在body中 p会自动继承。

如果p要用到更多的样式，再好限定一个范围 如下：

.article p{
    line-height: 2em;
    color:yellow;
    background:blue;
    font-size:100em;
}

追问

p如何空两格呢？又怎样写呢？

追答

 p{
    line-height: 2em;
}

就这样写，但是最好是前面给它一个限定的范围，不要全局都起作用

例如：

<style type="text/css">
    #main p {line-height: 2em;} 
</style>
<div id="main">
    <p>内容</p>
    <p>内容</p>
    <p>内容</p>
    <p>内容</p>
</div>
<div id="aside">
    <p>内容</p>
    <p>内容</p>
    <p>内容</p>
    <p>内容</p>
</div>

 这样只有在<div id="main"> 区域内的P元素缩进2格

追问

哦！其实我的实际代码就是这样，但当在p img时就不过空2格

追答

那你在定义这样的样式就好

#main p img {
    text-indent: 0;
}

Answer 3

text-ident-- 定义文本首行的缩进(在首行文字之前插入指定的长度)

• 取值: <length> | <percentage> | inherit

• <length>: 长度表示法

• <percentage>: 百分比表示法

• inherit: 继承

• 初始值: 0

• 继承性: 是

• 适用于: 所有元素

• text:文本.indent:缩进.

• 引用网址:http://www.dreamdu.com/css/property_text-indent/

Answer 4

p img{float:left}

Answer 5

p{text-indent:2em;}
p.pimg{text-indent:0;}
<p class="pimg"><img src="test.jpg" /></p>

追问

p .pimg?是什么意思？能够解释一下吗？

追答

有pimg属性的img标签使用另外一套样式，改过原先的样式表