仅将css用于一个URL

Question

我可以在wordpress网站上仅针对一个网址定位css类吗？

.class a {pointer-events:auto;}
.class a[href="URL"]{pointer-events: none;}

这不起作用，还有另外一种方法吗？

我可以使用javascript执行此操作吗？

我需要禁用包含示例部件的页面的“添加到购物车”按钮（不应添加到购物车中的内容）。

唯一的其他唯一属性是data-product_id="32570"

有没有办法在css中定位data-product_id="32570"？

Answer 1

您可以使用css并定位我认为是定位此

的最佳方式的唯一属性

.class a[data-product_id="32570"] { ... }

此处有更多文档和用途https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors

Answer 2

小提琴：http://jsfiddle.net/g68wtwfq/

发布的.class a[href="URL"]{pointer-events: none;}的CSS应该有效。

但是，我建议您在服务器端执行（不要输出href）或使用JavaScript（删除href属性）

如果您想基于数据属性进行定位

.class a[data-product_id="32570"]{pointer-events: none;}

应该这样做。

我要这样做的一件事是a应该是.class的后代。如果您要定位具有class="class"的链接，则应使用a.class[attr=value]代替。

Answer 3

是的，您可以通过CSS中的数据属性选择元素。

[data-product_id="32570"] {
  /* your styles */
}

这是attribute selector。当然，它可以以父.class作为前缀。

您的问题有点含糊不清，我不清楚您是否确实希望定位指向某个网址的链接或 特定网址，但在WordPress中，CSS类被添加到每个页面的body标记可帮助您识别它的页面类型并相应地设置样式。

e.g。

仅限主页：

body.home .foo { ... your CSS properties here ... } 

ID为1的帖子：

body.postid-1 .foo { ... }

ID为2的页面：

body.pageid-1 .foo { ... }

一个名为＆＃39;示例＆＃39;的类别：

body.category-example .foo { ... }