Question

我想从Hello2 href链接中删除该图标，同时保留我的CSS代码。如何覆盖样式后的[target =“ _ blank”]：

HTML：

<a class="" href="#" target="_blank">Hello1</a>

<a class="" href="#" target="_blank">Hello2</a>

CSS：

        a[target="_blank"]:after {
  content:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAQElEQVR42qXKwQkAIAxDUUdxtO6/RBQkQZvSi8I/pL4BoGw/XPkh4XigPmsUgh0626AjRsgxHTkUThsG2T/sIlzdTsp52kSS1wAAAABJRU5ErkJggg==);
      margin: 0 3px 0 5px;
    }

JSFiddle： https://jsfiddle.net/xbaha/kxdzwro4/7/

Answer 1

您可以将一个类添加到第二个a标记中，然后使用after将其从not选择器中排除。

a[target="_blank"]:not(.no-icon):after {
      content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAQElEQVR42qXKwQkAIAxDUUdxtO6/RBQkQZvSi8I/pL4BoGw/XPkh4XigPmsUgh0626AjRsgxHTkUThsG2T/sIlzdTsp52kSS1wAAAABJRU5ErkJggg==);
      margin: 0 3px 0 5px;
    }

<a class="" href="#" target="_blank">Hello1</a>
    
<a href="#" target="_blank" class="no-icon">Hello2</a>

Answer 2

如果我理解正确，您想删除链接后面的小图标吗？而已？试试这个吧。通过这种方法，所有具有a属性的target = "_ blank"标签都会受到影响，因此将显示为没有小图标：

CSS

a[target="_blank"]:after {content: none;margin: 0 3px 0 5px;}

a[target="_blank"]:after {
  content:none;
  margin: 0 3px 0 5px;
}

<a class="" href="#" target="_blank">Hello1</a>

<a class="" href="#" target="_blank">Hello2</a>

如何覆盖:: after CSS选择器？

2 个答案: