css - 为 p 标签设置样式，但在它们有标签时不设置

Question

我在这里的第一篇文章，不幸的是它不会那么令人兴奋，我需要一个包含 IE6 的答案。

为了获得段落之间的空间，我将我的<p>标签设置为：

div.content_cms p {
 margin-top: 0px;
 margin-bottom: 15px;
 padding: 0px 15px 0px 0px;
}

用于分隔段落的边距底部。这当然工作正常。但是我还需要用 html 设置链接的样式是这样的：

<p><a href="#">Text</a> </p>

当有上面示例中的链接时，我不希望应用 margin-bottom。我试图用这个来修复它：

div.content_cms p a {
 margin-bottom: 0px !important;
}

这当然行不通。

我正在<a>使用 jQuery 向标签添加一个类，这样我就可以自动向链接添加一个图标。我尝试添加

margin-bottom: 0px !important;

到我用 jQuery 添加的类，但这也不起作用。

<p>paragraphs</p> 用文本而不是带链接的段落来设置间距的最佳方式是什么？

谢谢你。

score 1 · Accepted Answer

您可以使用 jQuery 轻松做到这一点：

$('p').has('a').css('margin-bottom', 0);

现场演示：http: //jsfiddle.net/NyjvT/

如果您需要设置多种样式，请考虑以下事项：

$('p').has('a').addClass('whatever');

CSS：

p.whatever { margin-botttom:0; font-size:20px; ... }

score 0 · Accepted Answer

我不认为你可以。

您最好的选择是为这些特定<p>元素添加一个类，并覆盖这些元素的边距：

div.content_cms p.nomargin {
    margin-bottom: 0px;
}

<p class="nomargin"><a href="#">Text</a></p>

如果这在服务器端是不可能的，你可以做一些 jQuery 黑客来处理它。

也许可以使用一些 CSS3 魔法，但我不确定；既然你想要 IE6 支持，那无论如何都是不可能的。

score 0 · Accepted Answer

仅使用 CSS 是不可能的。

CSS（层叠样式表）仅在文档树中起作用。

原因是性能。

欲了解更多信息，请阅读：

您需要使用 javascript 才能工作。

3 回答 3