CSS selector style

Question

I have not seen anything here about this with a quick search, if any, let me know.

Here is an example CSS selector that I would write.

div#container div#h h1 { /* styles */ }
div#container div#h ul#navi { /* styles */ }
div#container div#h ul#navi li.selected { /* styles */ }

I write all my CSS as. This allows me to stop using styles, and I can technically reuse the same class name. For example, I could use .selected on several elements throughout the site.

I also indicate the element type (div, ul, etc.) before the / id class if this style is not used for multiple elements. I also point the element before id, although there will be only one identifier, because it allows me to easily know the element when reading my CSS. For example, I immediately learn that the em # example will most likely have a font style in italics.

This is not a question of building CSS, it's about writing selectors.

I would like to hear opinions about this approach, as I have used it for many years, and I am reassessing my work.

Although this is somewhat off topic, I also write my selectors like this for selector libraries (like jQuery). Although I did not examine the internal structure of jQuery to see if there is a performance issue when specifying an element with an identifier.

Answer 1

I think it really depends on what the selector is for.

, "" - , , / , .., , . , , - , , SO - , .

, . , , , - - , , . , , , (#container #h), , . , .

CSS , "", , , , , . #navi #h , - #navi, .

, , .

Answer 2

, , . , , .