Question

我有一个p标记，其中有div内容为-当padding-right:-9px;用于div padding-left:10px;时p标签不再有效。我如何克服这种情况？

这是HTML：

<p>
  <div id="id">-</div>TExT HeRe
</p>

和CSS：

#id
{
    padding-right:-9px;
    display:inline;
}
p
{
    padding-left:10px;
}

Answer 1

那是因为：

<p>
  <div id="id">-</div>TExT HeRe
</p>

无效的HTML，很可能实际上是这样呈现的：

<p></p>
<div id="id">-</div>TExT HeRe

我建议使用span元素而不是div元素。

Answer 2

你的HTML在语义上是不正确的：你不应该在里面有一个带有div的<p>元素;最好使用<span>。我如何解决这个问题的方法是将<p>置于<div>内的<span>和<p>内。另外，为您的<div>提供位置，宽度和高度。

＆＃13;

<style>
#div_1 {
	position: relative;
	height: 300px;
	width: 300px;
	background-color: pink;
	}
#id {
	padding-right: -9px;
	display: block;
	background-color: cyan;
	width: 50px;
	position: relative;
	
	}
p {
	padding-left: 10px;
	
	}
</style>

＆＃13;

<!DOCTYPE html>
<html>
<head>

</head>
<body>
<div id="div_1">
	<p>
	<span id="id">-</span>TexT HeRe
	</p>
</div>
</body>
</html>

＆＃13;

Answer 3

我不完全确定，因为我对CSS不太好，但是我看到过这样的东西，这可能是你正在寻找的东西？

<style>
#id{
base css
}
#id > p{
any paragraph within the id div will get these properties
}
</style>

如何覆盖容器div的属性

3 个答案: