Middle
Name the specificity of CSS selectors in order of increasing priority.
sobes.tech AI
Answer from AI
The specificity of CSS selectors determines which style will be applied when multiple rules conflict. In order of increasing priority, specificity is as follows:
- Type selectors (elements) and pseudo-elements — for example,
div,p,::before. - Classes, attributes, and pseudo-classes — for example,
.class,[type="text"],:hover. - ID selectors — for example,
#header. - Inline styles — styles directly written in the
styleattribute of an element.
Example:
/* Specificity: 0,0,0,1 */
div {}
/* Specificity: 0,0,1,0 */
.class {}
/* Specificity: 0,1,0,0 */
#id {}
/* Specificity: 1,0,0,0 */
style="color: red;" /* inline style */
The higher the specificity, the more priority the rule has.