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. h2+p { margin-top: .5em} is an example of a _____ selector
Chrome & Safari
HEX code
*
adjacent sibling

2. 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
width
unordered (<ul>)
16
id

3. Rules with a higher _____ are the ones that will be used
box-shadow
first-letter
:focus pseudo-class
specificity

4. Attribute specifying the location of an external style sheet
rel="stylesheet"
Box Model
href="<relative URL here>"
-moz-

5. Shorthand for background property
height
#F9A
background: [color] [image] [repeat] [attachment] [position];
attachment (with values of 'scroll' or 'fixed')

6. These 'flavors' of selectors are often used by JavaScript
a:link{text-decoration: none;}
reset
zero out
attribute selectors

7. The 'internal' space between content area & border
16
padding
visited
Chrome & Safari

8. Three ways to provide styles: external style sheet - ________- style attributes applied to a single element (inline)
Pseudo-classes
RGBA
ul{ list-style: none;}
embedded styles

9. * [ href ] { font-size: 95%; } is an example of a(n) _____ selector
attribute
external
embedded styles
collapsed

10. 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

11. Linear gradient syntax
descendant
background-image: linear-gradient(direction, color %, color %, ...);
id
margin

12. Four 'flavors' of relational selectors: ________ - adjacent sibling - child (not supported by some older browsers like IE6) - general sibling (new to CSS3)
unordered (<ul>)
background: [color] [image] [repeat] [attachment] [position];
descendant
reset

13. HSL: Hue - Saturation - ______
Lightness
Pseudo-classes
a:link{text-decoration: none;}
<li>

14. An HTML element may be a selector (<p> for example). This is known as a rule that selects by ______
-moz-
background: [color] [image] [repeat] [attachment] [position];
collapsed
type

15. ________ are selectors that let you select a portion of text
background: [color] [image] [repeat] [attachment] [position];
margin
Chrome & Safari
Pseudo-elements

16. Shorthand border syntax
Pseudo-elements
pseudo-classes
border: [width] [style] [color];
attribute

17. Keyword with 'background' that specifies if and how an image repeats
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
adjacent sibling
-o-
a:link{text-decoration: none;}

18. 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 ______
Alpha
border: [width] [style] [color];
id
:focus pseudo-class

19. HTML tag used for embedded styles
box-shadow
<style>
ul{ list-style: none;}
formatting

20. Wildcard (universal selector) to select all elements
em
<li>
first-letter
*

21. #main { padding: 1em;} is an example of a selector made by _____
pseudo-classes
block
clickable
id

22. Keyword with 'background' that specifies the initial horizontal and vertical positions of an image
attribute
position (with values: left, center, right, top, center, bottom)
background-image: linear-gradient(direction, color %, color %, ...);
collapsed

23. The default width of an element:As wide as the ______ that contains it
block
attribute
specific
Firefox

24. CSS is a special language used just for _____
href="<relative URL here>"
formatting
clickable
pseudo-classes

25. Sequence in which styles are applied: _______ - embedded - inline
external
ul{ list-style: none;}
box-shadow
media

26. Rule to remove underlining in a hyperlink that hasn't yet been visited
external
!important
a:link{text-decoration: none;}
background: [color] [image] [repeat] [attachment] [position];

27. Five common CSS pseudo classes:link - _______ - active - hover - focus
#F9A
visited
padding
<style>

28. Two common pseudo-elements: ______ - first-line
first-letter
clickable
last
:focus pseudo-class

29. Prefix for linear gradient commands in Safari & Chrome
-webkit-
margin
Chrome & Safari
:focus pseudo-class

30. border shorthand syntax
border: [width] [style] [color];
block
specific
embedded styles

31. #main>p{ font-size: 11pt; } is an example of a ______ selector
child
block
clickable
http://html5shiv.googlecode.com/svn/trunk/html5.js

32. The p.highlight selector is more _____ than the .highlight selector
comma (,)
specific
multiple selectors
attribute selectors

33. Three common CSS3 pseudo-classes: first-child - last-child - _______
Firefox
a img {border: none;}
min-width
only-child

34. Prefix for linear gradient commands in Firefox
rel="stylesheet"
ul{ list-style: none;}
attribute selectors
-moz-

35. Zeroing out the default browser styles using the wildcard selector (*) is often call using the _____ selector
reset
attribute selectors
Pseudo-classes
Lightness

36. Tag used to bring CSS into a web page from an external source
link
attribute selectors
attachment (with values of 'scroll' or 'fixed')
comma (,)

37. Shortcut HEX code for #FF99AA
http://html5shiv.googlecode.com/svn/trunk/html5.js
Relative
#F9A
id

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

39. Two new box model properties in CSS3: border-radius and ________
width
box-shadow
only-child
pseudo-classes

40. .right {text-align: right;} is an example of a selector made by _______
block
class
background-image: linear-gradient(direction, color %, color %, ...);
background: [color] [image] [repeat] [attachment] [position];

41. Backwards compatibility for ________ & rounded corners & shadows -moz-border-radius & -moz-box-shadow
padding
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
Firefox
general sibling (new to CSS3)

42. In order of most to least specificity by selector type: id, (class, attribute, _____), (element or pseudo-element)
pseudo-class
width
href="<relative URL here>"
media

43. Backwards compatibility for __________ & shadows -webkit-box-shadow
border: [width] [style] [color];
Chrome & Safari
formatting
unordered (<ul>)

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

45. The ____ attribute is used to specify the platform that the style sheet is for (mobile - print etc)
descendant
reset
only-child
media

46. _____ measurements are recommended for font sizes
Relative
id
ul{ list-style: none;}
embedded styles

47. _______ Memory Aid: TRBL ('trouble' = top, right, bottom, left)
http://html5shiv.googlecode.com/svn/trunk/html5.js
background: [color] [image] [repeat] [attachment] [position];
Box Model
border: [width] [style] [color];

48. The 'external' space or 'force field' between an element & it's containing element
margin
user style sheet
border: [width] [style] [color];
#F9A

49. The colon (:) is indicative of __________
general sibling (new to CSS3)
Box Model
attribute
pseudo-classes

50. HSLA: Hue - Saturation - Lightness - _____
user style sheet
-webkit-
Alpha
background-image: linear-gradient(direction, color %, color %, ...);