Use CSS3 in applications - Programming in HTML5 with JavaScript and CSS3 - page 319

Correct answer: C

2.

Incorrect: .required is a class selector.

A.

Incorrect: #required is an ID selector.

B.

Correct: input[required] is an attribute selector.

C.

Incorrect: :required is a pseudo-class that would be combined with an element
selector.

D.

Correct answer: D

3.

Incorrect: a:link would specify the styles for an unvisited hyperlink.

A.

Incorrect: a:mouseover is not a valid pseudo-class.

B.

Incorrect: a:beforeclick is not a valid pseudo-class.

C.

Correct: a:hover will change the style when the user moves the mouse over the
link.

D.

Objective 4.6: Thought experiment
When you want to achieve specific formatting on complex webpages, you need to account
for the hierarchy of your page and ensure that you understand how the inheritance is going
to impact the nested HTML elements' styles. The more specific your selectors, the more CSS
you need to write but have more control. The following code will demonstrate a specific se-
lector that will alter only the first character of the first paragraph when a user hovers over it:

p:first-child:hover:first-letter {
font-size: xx-large;
}

This code does not seem like much, but it is very specific. It will override default inheri-
tance and any other styles defined for that same element. Consider the following CSS:

p:first-child:first-letter {
font-size: xx-small;
}
p:first-child:hover:first-letter {
font-size: xx-large;
}

The first selector will default the size of the first letter to xx-small but the hover class will
override this. This is where it may be desirable to use the !important keyword to force the xx-
small font. In this example, the two styles purely conflict. You would need to choose one over
the other.