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. Keyword with 'background' that specifies the initial horizontal and vertical positions of an image
position (with values: left, center, right, top, center, bottom)
type
Lightness
last

2. Three common CSS3 pseudo-classes: first-child - last-child - _______
embedded styles
block
only-child
media

3. To mark a rule so that it will override any other rules
!important
user style sheet
<li>
background: [color] [image] [repeat] [attachment] [position];

4. Shortcut HEX code for #FF99AA
a:link{text-decoration: none;}
#F9A
block
block

5. Keyword with 'background' that specifies if and how an image repeats
margin
:focus pseudo-class
specific
repeat (values: repeat, repeat-x, repeat-y, no-repeat)

6. ________ are selectors that let you select a portion of text
Lightness
screen
*
Pseudo-elements

7. Five common CSS pseudo classes:link - _______ - active - hover - focus
block
a img {border: none;}
visited
unordered (<ul>)

8. URL for bringing in a JavaScript 'shiv' or 'shim' for elements to be used in older browsers
embedded styles
16
background-image: linear-gradient(direction, color %, color %, ...);
http://html5shiv.googlecode.com/svn/trunk/html5.js

9. [ ] are indicative of _______ selectors
border: [width] [style] [color];
:focus pseudo-class
Relative
attribute

10. * [ href ] { font-size: 95%; } is an example of a(n) _____ selector
general sibling (new to CSS3)
-o-
height
attribute

11. HTML tag used for embedded styles
type
ul{ list-style: none;}
height
<style>

12. What does this do? padding: 2px, 4px, 6px, 8px;
border: [width] [style] [color];
Nothing! the values are not comma separated (delimited)
#F9A
a:link{text-decoration: none;}

13. 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>)
specific
HEX code

14. #main { padding: 1em;} is an example of a selector made by _____
id
multiple selectors
screen
last

15. The ____ attribute is used to specify the platform that the style sheet is for (mobile - print etc)
Firefox
child
media
href="<relative URL here>"

16. In order of most to least specificity by selector type: id, (class, attribute, _____), (element or pseudo-element)
pseudo-class
-o-
em
padding

17. Three ways to provide styles: external style sheet - ________- style attributes applied to a single element (inline)
embedded styles
Lightness
#F9A
class

18. 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
last
collapsed
link
a:link{text-decoration: none;}

19. Prefix for linear gradient commands in Safari & Chrome
-webkit-
<li>
descendant
Alpha

20. The 'internal' space between content area & border
padding
pseudo-classes
screen
-webkit-

21. border shorthand syntax
border: [width] [style] [color];
width
#F9A
multiple selectors

22. Height of a box: top margin + top border + top padding + ______ + bottom padding + bottom border + bottom margin
reset
class
background-image: linear-gradient(direction, color %, color %, ...);
height

23. Three ways to specify colors in traditional CSS:color name - RGB - _______
link
multiple selectors
HEX code
border: [width] [style] [color];

24. Three ways to code CSS3 colors: _____ - HSL - HSLA
ul{ list-style: none;}
RGBA
Firefox
last

25. Zeroing out the default browser styles using the wildcard selector (*) is often call using the _____ selector
formatting
first-letter
Pseudo-elements
reset

26. _______ Memory Aid: TRBL ('trouble' = top, right, bottom, left)
Nothing! the values are not comma separated (delimited)
Box Model
descendant
<style>

27. A rule to remove bullets from a list
ul{ list-style: none;}
-o-
attribute
multiple selectors

28. Linear gradient syntax
-webkit-
background-image: linear-gradient(direction, color %, color %, ...);
specificity
descendant

29. Prefix for linear gradient commands in Opera
a:link{text-decoration: none;}
a img {border: none;}
box-shadow
-o-

30. _____ measurements are recommended for font sizes
Relative
block
attribute
repeat (values: repeat, repeat-x, repeat-y, no-repeat)

31. Shorthand for background property
<li>
clickable
multiple selectors
background: [color] [image] [repeat] [attachment] [position];

32. HSLA: Hue - Saturation - Lightness - _____
Alpha
:focus pseudo-class
descendant
border: [width] [style] [color];

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

34. Shorthand border syntax
type
border: [width] [style] [color];
screen
block

35. Backwards compatibility for __________ & shadows -webkit-box-shadow
Chrome & Safari
margin
Relative
Lightness

36. HTML5 structural tags in older browsers must be styled as _____ elements
16
clickable
block
attribute selectors

37. Tag used to bring CSS into a web page from an external source
link
<style>
media
http://html5shiv.googlecode.com/svn/trunk/html5.js

38. Attribute for an external style sheet
-webkit-
unordered (<ul>)
screen
rel="stylesheet"

39. List alignments work best with ____ measurements
id
reset
em
repeat (values: repeat, repeat-x, repeat-y, no-repeat)

40. The default width of an element:As wide as the ______ that contains it
margin
Box Model
block
width

41. 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
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
attribute
width
Nothing! the values are not comma separated (delimited)

42. _______ are predefined classes that apply to specific conditions
Pseudo-classes
only-child
a img {border: none;}
link

43. HSL: Hue - Saturation - ______
width
16
Lightness
HEX code

44. CSS is a special language used just for _____
formatting
border: [width] [style] [color];
Pseudo-classes
adjacent sibling

45. There are ____ descriptive color names
attribute
a img {border: none;}
16
embedded styles

46. Backwards compatibility for ________ & rounded corners & shadows -moz-border-radius & -moz-box-shadow
a:link{text-decoration: none;}
reset
Firefox
rel="stylesheet"

47. The colon (:) is indicative of __________
#F9A
attachment (with values of 'scroll' or 'fixed')
external
pseudo-classes

48. Keyword with 'background' that specifies whether an image scrolls with the document or remains in a fixed position

Warning: Invalid argument supplied for foreach() in /var/www/html/basicversity.com/show_quiz.php on line 183

49. To format the space between a bullet and text in an unordered list style some left padding on the _____ element within the list
<li>
Box Model
external
http://html5shiv.googlecode.com/svn/trunk/html5.js

50. An HTML element may be a selector (<p> for example). This is known as a rule that selects by ______
Chrome & Safari
border: [width] [style] [color];
*
type