CSS: are classes and identifiers compatible?

Question

I know others have been asking about using class and id in CSS files like

Div: Class vs Id

So, I know the semantic and syntactic differences between a class and id: this identifier should be used for elements that are used only once, and the class should be used for elements that share common attributes.

But this is not a strict rule, is it? What is the harm when using an identifier for multiple elements? Or use the class for just one? After all, this is not a “one element”, but just a collection (class) in which there is only one thing?

Will the browser CSS interpreter throw an error if I break the rules? I have not seen this.

So why do we have both id and class? Why not just call one or the other and call it good?

Answer 1

In response to the question “why do we use both classes and identifiers for CSS when you are allowed to have one instance of a class?”, Look at it that way.

We do not need identifiers for CSS. We could just use separate instances of classes.

But we need identifiers for JavaScript. So why not use them in CSS too?

Imagine a world in which there were IDs, but only for JavaScript.

You would need to write code like this:

<div id="wrapper" class="wrapper">
    <div id="nav" class="nav">

    </div>
</div>

etc.

Answer 2

; , - , ?; -)

Answer 3

CSS , , Javascript , .

, , . , .

: (X) HTML- :

<div class="foo bar"></div>

.

Answer 4

CSS ( ), .

( , ), , , .

, "id" CSS ( , ), - JavaScript!

"document.getElementById()", , ...

Answer 5

, . , , , id. , , , CSS Javascript. id class, . , .

Answer 6

, . id , - javascript - id : id, : html- <a href="http://www.site.com/home.html#news>, id = "news". , , . , , .

Answer 7

, , , , .

:

• (#menu)
• , (#content)
• , (# )

, , (, ).

:

• .menu-items

• .articles

• .external-link

, ... .

, , (,.featured-article) (# current-menu-item).

Of course, you can always use the inplace classes of identifiers, but I think that using identifiers makes it clear which elements are unique and which are not. In addition, I prefer to have fewer space-separated names in my class attributes so that they are readable enough.