SUBJECTS
|
BROWSE
|
CAREER CENTER
|
POPULAR
|
JOIN
|
LOGIN
Business Skills
|
Soft Skills
|
Basic Literacy
|
Certifications
About
|
Help
|
Privacy
|
Terms
|
Email
Search
Test your basic knowledge |
CSS 3
Start Test
Study First
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. Height of a box: top margin + top border + top padding + ______ + bottom padding + bottom border + bottom margin
height
zero out
class (.)
embedded styles
2. Two common pseudo-elements: ______ - first-line
first-letter
width
Pseudo-classes
height
3. If a bottom margin encounters an adjacent top margin they are _____ and the larger margin is applied
Relative
pseudo-classes
padding
collapsed
4. Backwards compatibility for ________ & rounded corners & shadows -moz-border-radius & -moz-box-shadow
a img {border: none;}
reset
Firefox
rel="stylesheet"
5. Shorthand for background property
Relative
background: [color] [image] [repeat] [attachment] [position];
attribute
reset
6. 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
Chrome & Safari
collapsed
descendant
7. Four 'flavors' of relational selectors: ________ - adjacent sibling - child (not supported by some older browsers like IE6) - general sibling (new to CSS3)
descendant
a:link{text-decoration: none;}
!important
box-shadow
8. To mark a rule so that it will override any other rules
a img {border: none;}
!important
screen
width
9. 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
http://html5shiv.googlecode.com/svn/trunk/html5.js
descendant
unordered (<ul>)
attachment (with values of 'scroll' or 'fixed')
10. Sequence in which styles are applied: _______ - embedded - inline
collapsed
embedded styles
visited
external
11. Some users with special needs may have set up a ______ which have a higher ranking in the 'cascade'
min-width
class (.)
attribute
user style sheet
12. Shorthand border syntax
border: [width] [style] [color];
type
min-width
-o-
13. box-shadow syntax: _________: horzOffset vertOffset blurRadius spread color; (not comma separated)
reset
box-shadow
background-image: linear-gradient(direction, color %, color %, ...);
em
14. #main li { color: green;} is an example of a _____ selector
descendant
#F9A
a img {border: none;}
border: [width] [style] [color];
15. Three common CSS3 pseudo-classes: first-child - last-child - _______
only-child
!important
child
type
16. _______ Memory Aid: TRBL ('trouble' = top, right, bottom, left)
block
adjacent sibling
embedded styles
Box Model
17. Width of a box: left margin + left border + left padding + _____ + right padding + right border + right margin
formatting
reset
width
margin
18. h2~p { margin-left: 2em; } is an example of a ______ selector
ul{ list-style: none;}
box-shadow
general sibling (new to CSS3)
em
19. CSS is a special language used just for _____
external
formatting
last
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
20. HTML5 structural tags in older browsers must be styled as _____ elements
only-child
box-shadow
a:link{text-decoration: none;}
block
21. Because different browsers have different default margins for block elements you often need to ________ those values using the * (wildcard) selector and set the margins explicitly
zero out
descendant
specificity
<style>
22. _____ measurements are recommended for font sizes
width
formatting
Relative
Pseudo-elements
23. Keyword with 'background' that specifies the initial horizontal and vertical positions of an image
box-shadow
position (with values: left, center, right, top, center, bottom)
RGBA
external
24. Prefix for linear gradient commands in Firefox
Pseudo-classes
pseudo-class
attribute
-moz-
25. 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
embedded styles
multiple selectors
visited
26. The 'internal' space between content area & border
Alpha
border: [width] [style] [color];
position (with values: left, center, right, top, center, bottom)
padding
27. Prefix for linear gradient commands in Opera
unordered (<ul>)
descendant
Alpha
-o-
28. #main { padding: 1em;} is an example of a selector made by _____
attachment (with values of 'scroll' or 'fixed')
<style>
id
descendant
29. Five common CSS pseudo classes:link - _______ - active - hover - focus
attribute
border: [width] [style] [color];
-o-
visited
30. An HTML element may be a selector (<p> for example). This is known as a rule that selects by ______
Relative
type
media
block
31. HSLA: Hue - Saturation - Lightness - _____
Alpha
href="<relative URL here>"
attribute
comma (,)
32. Three ways to provide styles: external style sheet - ________- style attributes applied to a single element (inline)
embedded styles
em
background-image: linear-gradient(direction, color %, color %, ...);
Box Model
33. Attribute specifying the location of an external style sheet
-moz-
href="<relative URL here>"
a:link{text-decoration: none;}
box-shadow
34. The delimiter symbol for multiple selectors for the same rule set
attachment (with values of 'scroll' or 'fixed')
em
child
comma (,)
35. In order of most to least specificity by selector type: id, (class, attribute, _____), (element or pseudo-element)
Box Model
border: [width] [style] [color];
adjacent sibling
pseudo-class
36. HTML tag used for embedded styles
min-width
descendant
RGBA
<style>
37. Rules with a higher _____ are the ones that will be used
Nothing! the values are not comma separated (delimited)
specificity
specific
rel="stylesheet"
38. _______ are predefined classes that apply to specific conditions
-o-
!important
Pseudo-classes
box-shadow
39. * [ href ] { font-size: 95%; } is an example of a(n) _____ selector
position (with values: left, center, right, top, center, bottom)
attribute
specific
media
40. 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 ______
:focus pseudo-class
Lightness
child
attribute selectors
41. The 'external' space or 'force field' between an element & it's containing element
attribute selectors
child
margin
unordered (<ul>)
42. .right {text-align: right;} is an example of a selector made by _______
block
unordered (<ul>)
class
descendant
43. Prefix for linear gradient commands in Safari & Chrome
box-shadow
external
min-width
-webkit-
44. To format the space between a bullet and text in an unordered list style some left padding on the _____ element within the list
a:link{text-decoration: none;}
<li>
-o-
type
45. A rule to remove bullets from a list
ul{ list-style: none;}
position (with values: left, center, right, top, center, bottom)
descendant
height
46. h1, h2, h3 {color: blue;} is an example of _____
http://html5shiv.googlecode.com/svn/trunk/html5.js
specificity
multiple selectors
rel="stylesheet"
47. 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
48. h2+p { margin-top: .5em} is an example of a _____ selector
margin
user style sheet
attachment (with values of 'scroll' or 'fixed')
adjacent sibling
49. Three ways to specify colors in traditional CSS:color name - RGB - _______
HEX code
RGBA
reset
Pseudo-elements
50. A rule to remove a hyperlink border from around an image hyperlink
a img {border: none;}
Alpha
block
*