2011-04-14 172 views
1

我正在使用支付服務,在我製作的模板中生成一堆代碼。事情是他們在命名一些div時使用了括號「()」。這對我來說是一個問題,因爲我必須對所有生成的div進行樣式設置,並且CSS不喜歡用括號命名的div。在CSS中使用括號()

其代碼:

<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; } 

有什麼我可以做的有適用於()使用命名的div的CSS?

+0

ID中不允許使用'()':http://www.w3.org/TR/html4/types.html#type-id – 2011-04-14 07:49:58

+1

即使不允許,它似乎也能正常工作。見http://jsfiddle.net/DLbWH/ – Ragnar123 2011-04-14 07:52:25

+0

這不會起作用,因爲在那個位置根本不允許使用括號。 – Rhapsody 2011-04-14 07:53:10

回答

5

主要問題是(括號)是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; } 
+0

非常感謝,這很好! – Walker 2011-04-14 08:02:56

+0

歲月流逝,大多數字符(包括括號)現在在ID中有效 - 在HTML5 – 2016-05-07 16:59:48

1

的()字符對於HTML ID屬性無效。

What are valid values for the id attribute in HTML?

你需要別的東西來改變你的cracket字符,或者完全刪除它們。我建議閱讀該問題的評分最高的答案,因爲還有其他字符雖然有效,但仍可能導致問題。

+0

我知道()字符在HTML ID屬性中無效。不幸的是,我無法改變這一點,因爲它是由斯堪的納維亞地區的大量網站使用的支付服務提供商生成的。我發送了一封電子郵件給SP,但我懷疑他們會對此做任何事情。 – Walker 2011-04-14 08:01:40

+0

我想,如果你真的絕望,你可以試試div [id =「wwctrl_paytypeLogo_AMEX(SE)」],但我不能擔保頁面呈現性能,它只會在支持CSS3選擇器的瀏覽器中工作 – GordonM 2011-04-14 08:16:18

+1

BoltClock的回答上面的工作精細。無論如何,戈登! – Walker 2011-04-14 08:17:46