CSS Selector Syntax
For this HTML:
<div id="idName" class="className">
...
</div>
I know this is correct selector syntax:
div.className {...}
div#idName {...}
By mistake I did:
#idName.className {...}
It seams to work but I don't think it's valid. Can anyone confirm if this is valid?
Edit:
To clarify, this id will be on many pages and, depending on the use of the page, may have differen开发者_StackOverflowt classes.
Page A:#content.one-column {...}
Page B:
#content.two-column {...}
It is valid. There is no rule that ID selectors have to come after class selectors.
To quote from the standard (emphasis mine):
A simple selector is either a type selector or universal selector followed immediately by zero or more attribute selectors, ID selectors, or pseudo-classes, in any order.
Yes, that's fine, though the meaning is different. Saying "#idName" instead of "div#idName" does not restrict to div elements.
It's perfectly valid, but kind of redundant. If you were to turn it into english it would say "select all elements with the id 'idname' and class 'className'". It's redundant because you can only have one instance of an element with a particular ID.
I believe it is valid syntax, as your class may change with the same id. However, you may run into this
#id.className
is a perfectly valid selector that will select all elements with both the ID and the class.
Even if it is valid or not, there cannot be more than one html node with same "id" in a valid HTML document, so, I guess you can just use div #idName to perform any tasks.
精彩评论