css - CSS选择器：没有作为孩子

Question

我正在尝试选择链接到没有子图像标签的外部网站的所有锚标签。如果我有一个图像作为链接，它也会在这些图像旁边添加一个小的外部链接图标，但我不希望这样。

这是我到目前为止所拥有的：

a[href^="http://"]{
  background:transparent url(..icon/external.png) center right no-repeat;
  display:inline-block;
  padding-right:18px;
}

作为额外的奖励，我如何让它与“https://”链接一起使用？

score 6 · Accepted Answer

这对于纯 CSS 是不可能的。但是，您可以使用一些 jQuery 魔法：

jQuery：

$("a[href^='http://']:not(:has(img))").addClass("external");

CSS：

a.external {
  background:transparent url(..icon/external.png) center right no-repeat;
  display:inline-block;
  padding-right:18px;
}

查看演示（包括 HTTPS）：http: //jsfiddle.net/hKTBp/1/

1 回答 1