not伪类用于将svg图标附加到网站中链接到外部站点的所有链接元素。我需要帮助禁用链接的社会图标上的:不伪类声明由页面生成器生成。

该网站是由我自己的超文本标记语言，CSS和脚本的主页，其余的网站是由Elementor生成的；一个WordPress页面生成器。页面构建器被配置为使用我的style.css文件，该文件包含:not伪类实现，我可以使用脚本定位页面构建器生成的任何内容。

页面构建器为链接的社交图标生成HTML和CSS。当在浏览器中构造页面时，:not伪类将svg图标附加到由页面构建器生成的链接社交图标，并且社交图标在视觉上被附加的svg图标破坏。

每个人都知道Facebook和LinkedIn是外部网站，社交图标链接不需要svg图标，我一直无法禁用，所以来这里寻求帮助。

我可以使用CSS和/或jQuery成功地定位页面中的社交图标，但是我尝试过的CSS和jQuery没有成功地禁用:not伪类。

我使用了!important，它会导致社交图标在页面中消失。

我曾尝试使用另一个透明的svg图标来替换外部链接图标，但可能没有成功，因为我可能使用了不正确的CSS。

我搜索过stackoverflow，阅读过类似的问题，也搜索过WWW，还没有找到一种选择性地应用CSS :not伪类声明的方法。

注意代理href的值，这段代码是functioning :not伪类，就像我的style.css文件中声明的那样：

/* functional as expected */
a[href ^="https"]:not([href *="the-deployed-website-tld"]):not([href *="the-local-server-tld"]) {
background: transparent url(assets/svg/layout/svg_link-external-11px.svg) no-repeat center right;
padding-right: 16px; }

CSS和属性选择器的使用可以改变社交图标的属性，但我尝试过的所有迭代都失败了，因为我试图禁用或删除svg图标的显示：

/* non-functional */
li.eael-team-member-social-link > a[href ^="https://facebook.com"] {
    background: none; }

// non-functional
$( "li.eael-team-member-social-link > a[href ^='https://facebook.com']" ).css( "background", "none" );

是否可以有选择地禁用:not伪类，以便它不需要影响页面构建器生成的社交图标，同时仍可用于指示页面中的链接转到外部网站？如果是这样的话，是怎么做的？

转载请注明出处:http://www.yixue91.com/article/20230526/1316313.html