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. To mark a rule so that it will override any other rules
collapsed
!important
-moz-
Pseudo-elements

2. The p.highlight selector is more _____ than the .highlight selector
box-shadow
http://html5shiv.googlecode.com/svn/trunk/html5.js
specific
border: [width] [style] [color];

3. #main li { color: green;} is an example of a _____ selector
descendant
box-shadow
class (.)
pseudo-class

4. Rules with a higher _____ are the ones that will be used
specificity
background: [color] [image] [repeat] [attachment] [position];
#F9A
attribute

5. Shortcut HEX code for #FF99AA
adjacent sibling
#F9A
screen
Chrome & Safari

6. _______ Memory Aid: TRBL ('trouble' = top, right, bottom, left)
block
Box Model
type
unordered (<ul>)

7. These 'flavors' of selectors are often used by JavaScript
Relative
attribute selectors
media
RGBA

8. The 'external' space or 'force field' between an element & it's containing element
Alpha
margin
-moz-
box-shadow

9. URL for bringing in a JavaScript 'shiv' or 'shim' for elements to be used in older browsers
descendant
http://html5shiv.googlecode.com/svn/trunk/html5.js
Firefox
unordered (<ul>)

10. _______ are predefined classes that apply to specific conditions
-moz-
Pseudo-classes
*
<li>

11. h2+p { margin-top: .5em} is an example of a _____ selector
a img {border: none;}
attribute
class
adjacent sibling

12. Prefix for linear gradient commands in Firefox
media
-moz-
background: [color] [image] [repeat] [attachment] [position];
min-width

13. border shorthand syntax
border: [width] [style] [color];
Box Model
comma (,)
specific

14. Height of a box: top margin + top border + top padding + ______ + bottom padding + bottom border + bottom margin
embedded styles
:focus pseudo-class
clickable
height

15. Two new box model properties in CSS3: border-radius and ________
box-shadow
embedded styles
em
block

16. #main { padding: 1em;} is an example of a selector made by _____
-o-
#F9A
ul{ list-style: none;}
id

17. HSL: Hue - Saturation - ______
visited
Lightness
specific
Firefox

18. Some users with special needs may have set up a ______ which have a higher ranking in the 'cascade'
Nothing! the values are not comma separated (delimited)
descendant
id
user style sheet

19. Two common pseudo-elements: ______ - first-line
first-letter
specificity
Box Model
16

20. box-shadow syntax: _________: horzOffset vertOffset blurRadius spread color; (not comma separated)
box-shadow
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
collapsed
user style sheet

21. h1, h2, h3 {color: blue;} is an example of _____
Lightness
multiple selectors
16
first-letter

22. The default width of an element:As wide as the ______ that contains it
padding
type
background: [color] [image] [repeat] [attachment] [position];
block

23. Wildcard (universal selector) to select all elements
comma (,)
*
rel="stylesheet"
descendant

24. Default for the media attribute
class
Relative
screen
general sibling (new to CSS3)

25. A rule to remove a hyperlink border from around an image hyperlink
16
Nothing! the values are not comma separated (delimited)
*
a img {border: none;}

26. CSS is a special language used just for _____
media
formatting
rel="stylesheet"
attribute

27. To format the space between a bullet and text in an unordered list style some left padding on the _____ element within the list
<li>
attribute
<style>
border: [width] [style] [color];

28. Backwards compatibility for __________ & shadows -webkit-box-shadow
Chrome & Safari
-o-
block
user style sheet

29. The 'internal' space between content area & border
min-width
padding
border: [width] [style] [color];
href="<relative URL here>"

30. Keyword with 'background' that specifies if and how an image repeats
background: [color] [image] [repeat] [attachment] [position];
-webkit-
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
formatting

31. Six properties for setting heights & widths: width - height - ______- max-width - min-height - max-height
Firefox
external
min-width
position (with values: left, center, right, top, center, bottom)

32. An HTML element may be a selector (<p> for example). This is known as a rule that selects by ______
descendant
type
Chrome & Safari
formatting

33. 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
multiple selectors
attribute
unordered (<ul>)
formatting

34. Use this 'flavor' of selector if you want to target multiple elements on a page with the same styling
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
clickable
class (.)
Pseudo-elements

35. Prefix for linear gradient commands in Opera
-o-
RGBA
Relative
box-shadow

36. A rule to remove bullets from a list
-webkit-
Firefox
Box Model
ul{ list-style: none;}

37. Five common CSS pseudo classes:link - _______ - active - hover - focus
class
visited
-moz-
-o-

38. Attribute for an external style sheet
rel="stylesheet"
position (with values: left, center, right, top, center, bottom)
em
type

39. Three ways to code CSS3 colors: _____ - HSL - HSLA
position (with values: left, center, right, top, center, bottom)
screen
href="<relative URL here>"
RGBA

40. Sequence in which styles are applied: _______ - embedded - inline
external
width
zero out
general sibling (new to CSS3)

41. HTML5 structural tags in older browsers must be styled as _____ elements
descendant
<style>
background-image: linear-gradient(direction, color %, color %, ...);
block

42. Prefix for linear gradient commands in Safari & Chrome
-webkit-
a img {border: none;}
#F9A
border: [width] [style] [color];

43. Attribute specifying the location of an external style sheet
border: [width] [style] [color];
formatting
HEX code
href="<relative URL here>"

44. The colon (:) is indicative of __________
pseudo-classes
a img {border: none;}
em
only-child

45. 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
reset
link
clickable
child

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

47. Shorthand border syntax
descendant
border: [width] [style] [color];
Firefox
background: [color] [image] [repeat] [attachment] [position];

48. There are ____ descriptive color names
block
box-shadow
href="<relative URL here>"
16

49. HSLA: Hue - Saturation - Lightness - _____
child
type
Alpha
Box Model

50. Rule to remove underlining in a hyperlink that hasn't yet been visited
specific
a:link{text-decoration: none;}
min-width
only-child