CSS Multiple Choice Questions on “Selectors”.
1. What type of selector is used in this case?
a) class Selectors
b) element Selectors
c) id Selectors
d) none of the mentioned
Answer: b
Clarification: These selectors are called element selectors and are simply used
as follows:
element-name { /* properties */ }
2. By applying an ___________ a style can be applied to just a single tag.
a) class rule
b) element rule
c) id rule
d) none of the mentioned
Answer: c
Clarification: By applying an id rule, a style can be applied to just a single tag. For example, if we name a tag with a unique id attribute as follows
id="id-value">
Affected Text</tag>
3. The _____________ attribute is used to define the name(s) of the class(es) to which a particular tag belongs.
a) class
b) element
c) id
d) none of the mentioned
Answer: a
Clarification: Self-explainatory.
4. What will be the output of below mentioned code snippet?
p strong {background-color: yellow;}
a) Strong have yellow background
b) Strong element within a p element have a yellow background
c) Both p and strong have yellow background
d) None of the mentioned
Answer: b
Clarification: All occurrences of the strong element within a p element have a yellow background.
5. A similar rule called the ____________ is specified using the plus sign (+) and is used to select elements that would be siblings of each other.
a) class selectors
b) attribute selectors
c) adjacent-sibling selector
d) none of the mentioned
Answer: c
Clarification: Self-explainatory.
6. Which of the following selectors selects any tag with an id attribute set?
a) E#id b) .class c) #id d) *
View Answer
Answer: c
Clarification: Example:#test {color: green;}
/* makes a tag with id=’test’ green */
7. Which of the following selectors selects direct descendents?
a) E > F b) E F c) E + F d) E ~ F
View Answer
Answer: a
Clarification: Example:
body > p {background-color: yellow;} /* makes all p tags that have the body tag as their immediate parent have the background color yellow */
8. Which of the following selectors selects siblings?
a) E.class b) E ~ F c) * d) E, F, G
View Answer
Answer: b
Clarification: Example:
p ~ strong {font-style: italic;} /* sets the font style to italic on all strong tags that have a p tag as a preceding sibling */
9. Which of the following selectors selects the specified elements of type E with a particular class value?
a) E.class b) E ~ F c) * d) E, F, G
View Answer
Answer: a
Clarification: Example:
h1.note {text-decoration: underline;} /* underlines all h1 tags with class='note' */
10. Which of the following selectors selects adjacent siblings?
a) E > F b) E F c) E + F d) E ~ F
View Answer
Answer: c
Clarification: Example:
h1 + p {color: red;} /* makes all p tags that are immediately preceded by an h1 tag red */