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. Shorthand for background property
border: [width] [style] [color];
class
a img {border: none;}
background: [color] [image] [repeat] [attachment] [position];

2. Three ways to code CSS3 colors: _____ - HSL - HSLA
a:link{text-decoration: none;}
class
RGBA
screen

3. In a set of possibly conflicting rules the one that is mentioned _____ is the one that will be used and all other things being equal
a img {border: none;}
last
<style>
-moz-

4. Rule to remove underlining in a hyperlink that hasn't yet been visited
a:link{text-decoration: none;}
background-image: linear-gradient(direction, color %, color %, ...);
<style>
general sibling (new to CSS3)

5. HSL: Hue - Saturation - ______
embedded styles
Lightness
only-child
child

6. There are ____ descriptive color names
external
padding
box-shadow
16

7. To mark a rule so that it will override any other rules
attribute selectors
width
Firefox
!important

8. #main li { color: green;} is an example of a _____ selector
multiple selectors
Relative
descendant
Pseudo-classes

9. A rule to remove bullets from a list
width
box-shadow
ul{ list-style: none;}
#F9A

10. An HTML element may be a selector (<p> for example). This is known as a rule that selects by ______
Lightness
-o-
-moz-
type

11. Three common CSS3 pseudo-classes: first-child - last-child - _______
only-child
id
border: [width] [style] [color];
-o-

12. The default width of an element:As wide as the ______ that contains it
block
*
specificity
-o-

13. _______ are predefined classes that apply to specific conditions
Pseudo-classes
border: [width] [style] [color];
box-shadow
Nothing! the values are not comma separated (delimited)

14. Three ways to provide styles: external style sheet - ________- style attributes applied to a single element (inline)
!important
embedded styles
block
RGBA

15. HSLA: Hue - Saturation - Lightness - _____
comma (,)
Alpha
*
collapsed

16. Keyword with 'background' that specifies the initial horizontal and vertical positions of an image
Pseudo-elements
Relative
position (with values: left, center, right, top, center, bottom)
!important

17. Backwards compatibility for __________ & shadows -webkit-box-shadow
descendant
Box Model
Chrome & Safari
specificity

18. Attribute specifying the location of an external style sheet
pseudo-class
specificity
<style>
href="<relative URL here>"

19. The colon (:) is indicative of __________
#F9A
descendant
collapsed
pseudo-classes

20. Attribute for an external style sheet
<li>
min-width
Relative
rel="stylesheet"

21. .right {text-align: right;} is an example of a selector made by _______
attachment (with values of 'scroll' or 'fixed')
descendant
class
16

22. Default for the media attribute
margin
screen
embedded styles
attribute selectors

23. Height of a box: top margin + top border + top padding + ______ + bottom padding + bottom border + bottom margin
height
attribute selectors
attachment (with values of 'scroll' or 'fixed')
descendant

24. CSS is a special language used just for _____
background: [color] [image] [repeat] [attachment] [position];
*
formatting
visited

25. Shorthand border syntax
border: [width] [style] [color];
width
!important
min-width

26. box-shadow syntax: _________: horzOffset vertOffset blurRadius spread color; (not comma separated)
border: [width] [style] [color];
box-shadow
position (with values: left, center, right, top, center, bottom)
Firefox

27. Five common CSS pseudo classes:link - _______ - active - hover - focus
a img {border: none;}
block
descendant
visited

28. h2+p { margin-top: .5em} is an example of a _____ selector
a img {border: none;}
min-width
only-child
adjacent sibling

29. Shortcut HEX code for #FF99AA
position (with values: left, center, right, top, center, bottom)
#F9A
class
child

30. Prefix for linear gradient commands in Opera
-o-
height
a img {border: none;}
first-letter

31. HTML5 structural tags in older browsers must be styled as _____ elements
block
-webkit-
descendant
general sibling (new to CSS3)

32. The 'internal' space between content area & border
padding
-webkit-
child
box-shadow

33. Sequence in which styles are applied: _______ - embedded - inline
external
-o-
padding
RGBA

34. Width of a box: left margin + left border + left padding + _____ + right padding + right border + right margin
width
attribute selectors
-moz-
class

35. A rule to remove a hyperlink border from around an image hyperlink
padding
box-shadow
external
a img {border: none;}

36. _______ Memory Aid: TRBL ('trouble' = top, right, bottom, left)
#F9A
a img {border: none;}
Box Model
border: [width] [style] [color];

37. The ______ keyword is typically used for centering an element in it's containing (parent) block - but to do that you must also specify the width of the element
width
reset
box-shadow
http://html5shiv.googlecode.com/svn/trunk/html5.js

38. _____ measurements are recommended for font sizes
background: [color] [image] [repeat] [attachment] [position];
class
Relative
attribute

39. Keyword with 'background' that specifies if and how an image repeats
collapsed
Nothing! the values are not comma separated (delimited)
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
a:link{text-decoration: none;}

40. Six properties for setting heights & widths: width - height - ______- max-width - min-height - max-height
Lightness
min-width
16
padding

41. The ____ attribute is used to specify the platform that the style sheet is for (mobile - print etc)
#F9A
media
collapsed
box-shadow

42. * [ href ] { font-size: 95%; } is an example of a(n) _____ selector
attribute
background-image: linear-gradient(direction, color %, color %, ...);
embedded styles
first-letter

43. h1, h2, h3 {color: blue;} is an example of _____
specificity
media
Relative
multiple selectors

44. The 'external' space or 'force field' between an element & it's containing element
margin
specificity
type
Relative

45. #main>p{ font-size: 11pt; } is an example of a ______ selector
child
width
Alpha
<style>

46. The p.highlight selector is more _____ than the .highlight selector
Firefox
height
only-child
specific

47. List alignments work best with ____ measurements
!important
formatting
em
external

48. border shorthand syntax
background-image: linear-gradient(direction, color %, color %, ...);
border: [width] [style] [color];
<li>
unordered (<ul>)

49. To make sure someone who can't use a mouse has the same experience as a 'mouser' style the :hover pseudo-class the same as the ______
unordered (<ul>)
RGBA
<li>
:focus pseudo-class

50. Two common pseudo-elements: ______ - first-line
margin
specific
collapsed
first-letter