CSS Selectors and Specificity Quiz Quiz

1. Selector Specificity

   Which of the following CSS selectors has the highest specificity?

   1. element type
   2. #myId
   3. .myClass
   4. element[attribute]
   5. * universal

2. Overriding Styles

   Given conflicting CSS rules, which factor determines the style that is ultimately applied to an element?

   1. The order in which the rules appear in the CSS file
   2. The number of characters in the selector
   3. The specificity of the selector
   4. The time the style was added
   5. The importance of the css

3. Attribute Selectors

   Which CSS selector targets an element with a specific attribute, regardless of its value?

   1. element.attribute
   2. element#attribute
   3. element[attribute]
   4. element attribute
   5. element(attribute)

4. Type Selectors

   What type of selector is 'h1' in the CSS rule 'h1 { color: blue; }'?

   1. Class selector
   2. ID selector
   3. Attribute selector
   4. Universal selector
   5. Type selector

5. Class Selector

   Which symbol is used to denote a class selector in CSS?

   1. #
   2. .
   3. $
   4. %
   5. u0026

6. ID Selector

   Which of the following correctly targets an element with the ID 'main-title'?

   1. .main-title
   2. id=main-title
   3. element[main-title]
   4. MainTitle
   5. #main-title

7. Universal Selector

   Which selector matches all elements on a page?

   1. all
   2. element
   3. *
   4. global
   5. any

8. CSS Specificity Calculation

   In CSS specificity, which of the following selectors will override the other?

   1. div {color:red;}
   2. body div {color: blue;}
   3. .container {color:green;}
   4. #container {color:yellow;}
   5. div#container {color: purple;}

9. Complex Selectors

   Which of the following selectors targets all paragraph elements that are direct children of a div with the class 'content'?

   1. .content p
   2. div.content u003E p
   3. .content u003E p
   4. div .content p
   5. div + .content u003E p

10. The Importance of !important

    What does the `!important` declaration do in a CSS rule?

    1. It encrypts the style.
    2. It makes the style apply only in Internet Explorer.
    3. It gives the style rule the highest priority, overriding all other conflicting styles.
    4. It makes the style rule apply only when printing.
    5. It makes the style optional