Test your basic knowledge |

CSS 3

Subject : it-skills

Instructions:

Answer 50 questions in 15 minutes.
If you are not ready to take this test, you can study here.
Match each statement with the correct term.
Don't refresh. All questions and answers are randomly picked and ordered every time you load a test.

This is a study tool. The 3 wrong answers for each question are randomly chosen from answers to other questions. So, you might find at times the answers obvious, but you will see it re-enforces your understanding as you take the test each time.

1. A rule to remove bullets from a list
ul{ list-style: none;}
min-width
comma (,)
em

2. Attribute specifying the location of an external style sheet
unordered (<ul>)
href="<relative URL here>"
background-image: linear-gradient(direction, color %, color %, ...);
Nothing! the values are not comma separated (delimited)

3. Keyword with 'background' that specifies the initial horizontal and vertical positions of an image
specificity
user style sheet
attribute
position (with values: left, center, right, top, center, bottom)

4. The 'internal' space between content area & border
screen
a:link{text-decoration: none;}
padding
!important

5. HSLA: Hue - Saturation - Lightness - _____
Relative
-o-
Alpha
Pseudo-elements

6. border shorthand syntax
external
attribute selectors
border: [width] [style] [color];
descendant

7. h2~p { margin-left: 2em; } is an example of a ______ selector
class (.)
comma (,)
#F9A
general sibling (new to CSS3)

8. Backwards compatibility for __________ & shadows -webkit-box-shadow
Chrome & Safari
HEX code
!important
Pseudo-classes

9. These 'flavors' of selectors are often used by JavaScript
<li>
Alpha
Relative
attribute selectors

10. _____ measurements are recommended for font sizes
Relative
height
-moz-
type

11. Default for the media attribute
a img {border: none;}
screen
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
:focus pseudo-class

12. Four 'flavors' of relational selectors: ________ - adjacent sibling - child (not supported by some older browsers like IE6) - general sibling (new to CSS3)
reset
class
RGBA
descendant

13. The p.highlight selector is more _____ than the .highlight selector
margin
adjacent sibling
width
specific

14. Five common CSS pseudo classes:link - _______ - active - hover - focus
collapsed
Pseudo-classes
visited
a img {border: none;}

15. The default width of an element:As wide as the ______ that contains it
clickable
block
multiple selectors
position (with values: left, center, right, top, center, bottom)

16. Keyword with 'background' that specifies if and how an image repeats
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
pseudo-classes
media
first-letter

17. In a navigation bar (horizontal): Code <a> elements nested in <li> elements of an _____ list and style the <li> elements as inline using the display property
box-shadow
unordered (<ul>)
comma (,)
pseudo-class

18. List alignments work best with ____ measurements
link
em
margin
Pseudo-elements

19. Backwards compatibility for ________ & rounded corners & shadows -moz-border-radius & -moz-box-shadow
class (.)
media
min-width
Firefox

20. #main li { color: green;} is an example of a _____ selector
multiple selectors
class
block
descendant

21. Rule to remove underlining in a hyperlink that hasn't yet been visited
RGBA
last
specificity
a:link{text-decoration: none;}

22. Width of a box: left margin + left border + left padding + _____ + right padding + right border + right margin
width
screen
<li>
Pseudo-classes

23. Shorthand border syntax
multiple selectors
position (with values: left, center, right, top, center, bottom)
background-image: linear-gradient(direction, color %, color %, ...);
border: [width] [style] [color];

24. To format the space between a bullet and text in an unordered list style some left padding on the _____ element within the list
<li>
background-image: linear-gradient(direction, color %, color %, ...);
unordered (<ul>)
border: [width] [style] [color];

25. Rules with a higher _____ are the ones that will be used
reset
specificity
clickable
attribute

26. Two common pseudo-elements: ______ - first-line
first-letter
a:link{text-decoration: none;}
Lightness
unordered (<ul>)

27. ________ are selectors that let you select a portion of text
*
attribute
-webkit-
Pseudo-elements

28. HSL: Hue - Saturation - ______
attribute selectors
href="<relative URL here>"
Lightness
multiple selectors

29. HTML5 structural tags in older browsers must be styled as _____ elements
border: [width] [style] [color];
block
pseudo-classes
collapsed

30. box-shadow syntax: _________: horzOffset vertOffset blurRadius spread color; (not comma separated)
:focus pseudo-class
specific
id
box-shadow

31. .right {text-align: right;} is an example of a selector made by _______
class
http://html5shiv.googlecode.com/svn/trunk/html5.js
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
margin

32. Height of a box: top margin + top border + top padding + ______ + bottom padding + bottom border + bottom margin
padding
child
height
zero out

33. h1, h2, h3 {color: blue;} is an example of _____
specific
attribute
multiple selectors
class (.)

34. There are ____ descriptive color names
comma (,)
16
zero out
formatting

35. The colon (:) is indicative of __________
pseudo-classes
screen
background: [color] [image] [repeat] [attachment] [position];
type

36. Sequence in which styles are applied: _______ - embedded - inline
background-image: linear-gradient(direction, color %, color %, ...);
external
reset
rel="stylesheet"

37. The ____ attribute is used to specify the platform that the style sheet is for (mobile - print etc)
class
block
media
general sibling (new to CSS3)

38. Shortcut HEX code for #FF99AA
collapsed
#F9A
a:link{text-decoration: none;}
child

39. Prefix for linear gradient commands in Firefox
-moz-
descendant
href="<relative URL here>"
padding

40. URL for bringing in a JavaScript 'shiv' or 'shim' for elements to be used in older browsers
http://html5shiv.googlecode.com/svn/trunk/html5.js
visited
<style>
Nothing! the values are not comma separated (delimited)

41. In a navigation list (vertical): To make the entire box for a link ____ you can set the display property for the <a> elements to block and use padding to provide the space around the links
attribute selectors
descendant
clickable
Box Model

42. Wildcard (universal selector) to select all elements
class
*
comma (,)
-o-

43. Zeroing out the default browser styles using the wildcard selector (*) is often call using the _____ selector
attachment (with values of 'scroll' or 'fixed')
type
ul{ list-style: none;}
reset

44. An HTML element may be a selector (<p> for example). This is known as a rule that selects by ______
first-letter
type
specificity
child

45. Three ways to code CSS3 colors: _____ - HSL - HSLA
-moz-
RGBA
height
Relative

46. Three ways to specify colors in traditional CSS:color name - RGB - _______
*
padding
HEX code
Lightness

47. A rule to remove a hyperlink border from around an image hyperlink
a img {border: none;}
unordered (<ul>)
link
position (with values: left, center, right, top, center, bottom)

48. Three common CSS3 pseudo-classes: first-child - last-child - _______
Alpha
-moz-
only-child
clickable

49. HTML tag used for embedded styles
class
padding
<style>
general sibling (new to CSS3)

50. Six properties for setting heights & widths: width - height - ______- max-width - min-height - max-height
zero out
attachment (with values of 'scroll' or 'fixed')
min-width
embedded styles