css - 在 CSS 中使用方括号 ()

Question

我正在使用一种支付服务，该服务会在我制作的模板中生成一堆代码。问题是他们在命名某些 div 时使用方括号“()”。这给我带来了一个问题，因为我必须为所有生成的 div 设置样式，而 CSS 不喜欢用方括号命名的 div。

他们的代码:

<div id="wwctrl_paytypeLogo_AMEX">
<div id="wwctrl_paytypeLogo_AMEX(SE)">
<div id="wwctrl_paytypeLogo_AMEX(DK)">

我的 CSS:

#wwctrl_paytypeLink_MTRO button { background: url(images/icon_pay_maestro.png) 265px 50% no-repeat; }
#wwctrl_paytypeLink_AMEX button,
#wwctrl_paytypeLink_AMEX(SE) button,
#wwctrl_paytypeLink_AMEX(DK) button { background: url(images/icon_pay_amex.png) 265px 50% no-repeat; }

我可以做些什么来将 CSS 应用于使用 () 命名的 div？

Answer 1

主要问题是 ( 方括号 ) 不是在 ID 属性中使用的有效字符。参见 the spec .

但是如果您不能更改 ID，您始终可以使用反斜杠 (\) 来转义您选择器中的括号(否则它们将充当特殊的伪类字符):

#wwctrl_paytypeLink_AMEX\(SE\) button,
#wwctrl_paytypeLink_AMEX\(DK\) button { background: url(images/icon_pay_amex.png) 265px 50% no-repeat; }