css - WheelNav JS CSS 样式

Question

我正在使用 WheelNavJS，我试图在同一页面上至少获得 3 个

根据.. http://wheelnavjs.softwaretailoring.net/documentation/css3.html

你使用语法

[class|=wheelnav-divWheel]

其中 divwheel 是 wheelnav Div 的 ID

我的问题是，因为我有多个轮子，每个轮子都有不同的 ID(但都属于同一类)是否有一种快速方法可以将相同的样式应用到我页面上的所有轮子？

[class|=wheelnav-divWheel],[class|=wheelnav-divWheel2],[class|=wheelnav-divWheel3]

似乎在某些情况下有效(并非全部取决于功能)并且看起来有点困惑？

我可以去掉吗 [类|=

这可能真的是新手，但在我通常使用 .和#

也许我真正要问的是，我可以更改它以应用于类而不是 ID。或者，如果有人指点我什么时候会使用 [class|=] 而不是通常的 # 或。选择器？

Answer 1

发生这种情况是因为 wheelnav 中的每个元素都有唯一的类名。例如:'wheelnav-wheel1-slice-selected-0'。这确保允许所有元素具有不同的样式。

基本上，您可以根据 wheelnav 的 holder div 仅应用这些类名。

[attribute|="value"]选择器用于从指定值开始选择具有指定属性的元素。

因此您可以使用 [class|='wheelnav'] 选择器实现您的需求。

[class|='wheelnav'] {
    fill: #1572b6;
    stroke: white;
    stroke-width: 2px;
    cursor: pointer;
}

这是一个JS Bin为此。