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;
}

デモを参照してください：http：//jsfiddle.net/hKTBp/

デモ（HTTPSを含む）を参照してください：http：//jsfiddle.net/hKTBp/1/

1 に答える 1