为什么在CSS中，＃1（作为div元素的id）样式不起作用？

Question

<div class="image" id="1"></div>
<div class="image" id="2"></div>
<div class="image" id="3"></div>

http://codepen.io/Chrez/pen/KdWrBe

As you see in the codepen the styling of "id='1'" doesn't work.

I need it this way because it's for slider, and my jQuery functions work this way.

Answer 1

Its CSS's rule that you can't use Number as starting character or a class or id. That is why it wont work. You at least have to put 1 alphabet before the number!

This is what said in w3c -

In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item). For instance, the identifier “B&W?” may be written as “B\\&W\\?” or “B\\26 W\\3F”.

http://www.w3.org/TR/CSS21/syndata.html#characters

Answer 2

是的，根据w3c我们不能使用#1 ，但是这个小css-hack将起作用： div[id="1"]或者只是.image[id="1"]