Question

Hay我有这样的元素

<span class='a.b'>

不幸的是，这个类名来自电子商务应用程序，无法更改。

我可以设置带有点的类名称吗？

像

.a.b { }

Answer 1

.a\.b { }

然而，周围的浏览器可能不支持此功能。

Answer 2

参加派对的时间很晚，但您可以使用属性选择器。

在您的情况下，要定位class='a.b'元素，您可以使用：

[class~="a.b"] {...}
// or
span[class~="a.b"] {...}

此外，这里是属性选择器的完整列表。

属性显示选择器

// Selects an element if the given attribute is present

// HTML
<a target="_blank">...</a>

// CSS
a[target] {...}

属性等于选择器

// Selects an element if the given attribute value
// exactly matches the value stated

// HTML
<a href="http://google.com/">...</a>

// CSS
a[href="http://google.com/"] {...}

属性包含选择器

// Selects an element if the given attribute value
// contains at least once instance of the value stated

// HTML
<a href="/login.php">...</a>

// CSS
a[href*="login"] {...}

属性从选择器开始

// Selects an element if the given attribute value
// begins with the value stated

// HTML
<a href="https://chase.com/">...</a>

// CSS
a[href^="https://"] {...}

属性以选择器结束

// Selects an element if the given attribute value
// ends with the value stated

// HTML
<a href="/docs/menu.pdf">...</a>

// CSS
a[href$=".pdf"] {...}

属性间隔选择器

// Selects an element if the given attribute value
// is whitespace-separated with one word being exactly as stated

// HTML
<a href="#" rel="tag nofollow">...</a>

// CSS
a[rel~="tag"] {...}

属性连字符选择器

// Selects an element if the given attribute value is
// hyphen-separated and begins with the word stated

// HTML
<a href="#" lang="en-US">...</a>

// CSS
a[lang|="en"] {...}

Source: learn.shayhowe.com

Answer 3

也许您可以扫描这些类的元素并添加可以设置样式的类。

例如，扫描具有“ a.b”类的所有元素，然后添加一个新的“ style-ab”类或此类。

我还没有发布任何示例代码，因为人们可能想使用原始Javascript或jQuery，这很简单。

为澄清起见，我的游戏框架与OP所描述的完全相同，因此可以将翻译应用于某些div和span。这不是确定班级名称的讨厌方法，它对人们使用带有短语关键字的字典时创建标记非常有用

Answer 4

是的，你可以。 CSS类名称的含义，如＆＃39; .a.b＆＃39;定位具有CSS名称的元素＆＃39; a＆＃39;它也有类名＆＃39; b＆＃39;，这就是说你在同一个元素中同时拥有这两个类。就像div.cssname以cssname为目标div元素一样。

样式元素在类名中带有点（。）

4 个答案: