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. In order of most to least specificity by selector type: id, (class, attribute, _____), (element or pseudo-element)
pseudo-class
Box Model
last
padding
2. .right {text-align: right;} is an example of a selector made by _______
external
class
*
border: [width] [style] [color];
3. CSS is a special language used just for _____
box-shadow
last
border: [width] [style] [color];
formatting
4. ________ are selectors that let you select a portion of text
adjacent sibling
Pseudo-elements
padding
block
5. #main { padding: 1em;} is an example of a selector made by _____
a img {border: none;}
general sibling (new to CSS3)
id
Chrome & Safari
6. The p.highlight selector is more _____ than the .highlight selector
class (.)
child
Pseudo-elements
specific
7. Two new box model properties in CSS3: border-radius and ________
last
ul{ list-style: none;}
box-shadow
background: [color] [image] [repeat] [attachment] [position];
8. * [ href ] { font-size: 95%; } is an example of a(n) _____ selector
attribute
href="<relative URL here>"
a img {border: none;}
min-width
9. Height of a box: top margin + top border + top padding + ______ + bottom padding + bottom border + bottom margin
:focus pseudo-class
!important
Lightness
height
10. A rule to remove a hyperlink border from around an image hyperlink
reset
a img {border: none;}
user style sheet
background: [color] [image] [repeat] [attachment] [position];
11. HSLA: Hue - Saturation - Lightness - _____
Alpha
16
zero out
Firefox
12. Attribute specifying the location of an external style sheet
href="<relative URL here>"
reset
specificity
descendant
13. Sequence in which styles are applied: _______ - embedded - inline
-moz-
type
attribute selectors
external
14. Shortcut HEX code for #FF99AA
attribute selectors
class (.)
#F9A
Box Model
15. 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
clickable
id
border: [width] [style] [color];
zero out
16. 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
link
media
width
attribute
17. 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
18. Shorthand for background property
background: [color] [image] [repeat] [attachment] [position];
pseudo-class
class
-moz-
19. Three ways to specify colors in traditional CSS:color name - RGB - _______
RGBA
16
HEX code
#F9A
20. Keyword with 'background' that specifies if and how an image repeats
rel="stylesheet"
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
adjacent sibling
external
21. Shorthand border syntax
Pseudo-elements
rel="stylesheet"
border: [width] [style] [color];
media
22. If a bottom margin encounters an adjacent top margin they are _____ and the larger margin is applied
collapsed
a img {border: none;}
external
margin
23. border shorthand syntax
Relative
last
border: [width] [style] [color];
box-shadow
24. Three ways to code CSS3 colors: _____ - HSL - HSLA
RGBA
comma (,)
block
Box Model
25. h1, h2, h3 {color: blue;} is an example of _____
pseudo-classes
multiple selectors
formatting
rel="stylesheet"
26. Linear gradient syntax
background-image: linear-gradient(direction, color %, color %, ...);
descendant
em
type
27. [ ] are indicative of _______ selectors
!important
attribute
Firefox
padding
28. The default width of an element:As wide as the ______ that contains it
a img {border: none;}
block
Alpha
Box Model
29. Rule to remove underlining in a hyperlink that hasn't yet been visited
HEX code
a:link{text-decoration: none;}
Alpha
16
30. These 'flavors' of selectors are often used by JavaScript
attribute selectors
border: [width] [style] [color];
width
class
31. The 'internal' space between content area & border
padding
pseudo-class
attribute selectors
height
32. Two common pseudo-elements: ______ - first-line
link
first-letter
:focus pseudo-class
Pseudo-elements
33. Tag used to bring CSS into a web page from an external source
a img {border: none;}
link
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
-moz-
34. Zeroing out the default browser styles using the wildcard selector (*) is often call using the _____ selector
reset
pseudo-class
http://html5shiv.googlecode.com/svn/trunk/html5.js
collapsed
35. The ____ attribute is used to specify the platform that the style sheet is for (mobile - print etc)
#F9A
href="<relative URL here>"
descendant
media
36. What does this do? padding: 2px, 4px, 6px, 8px;
Nothing! the values are not comma separated (delimited)
Pseudo-classes
*
comma (,)
37. Prefix for linear gradient commands in Firefox
-moz-
http://html5shiv.googlecode.com/svn/trunk/html5.js
descendant
*
38. To format the space between a bullet and text in an unordered list style some left padding on the _____ element within the list
Alpha
<li>
attribute selectors
child
39. Prefix for linear gradient commands in Opera
background-image: linear-gradient(direction, color %, color %, ...);
-o-
ul{ list-style: none;}
Chrome & Safari
40. h2~p { margin-left: 2em; } is an example of a ______ selector
<style>
background-image: linear-gradient(direction, color %, color %, ...);
block
general sibling (new to CSS3)
41. h2+p { margin-top: .5em} is an example of a _____ selector
border: [width] [style] [color];
zero out
last
adjacent sibling
42. URL for bringing in a JavaScript 'shiv' or 'shim' for elements to be used in older browsers
descendant
width
http://html5shiv.googlecode.com/svn/trunk/html5.js
min-width
43. Three ways to provide styles: external style sheet - ________- style attributes applied to a single element (inline)
:focus pseudo-class
-o-
class
embedded styles
44. List alignments work best with ____ measurements
Box Model
Chrome & Safari
repeat (values: repeat, repeat-x, repeat-y, no-repeat)
em
45. Four 'flavors' of relational selectors: ________ - adjacent sibling - child (not supported by some older browsers like IE6) - general sibling (new to CSS3)
descendant
collapsed
specificity
adjacent sibling
46. The colon (:) is indicative of __________
class (.)
-moz-
attribute
pseudo-classes
47. The delimiter symbol for multiple selectors for the same rule set
border: [width] [style] [color];
comma (,)
min-width
Lightness
48. Wildcard (universal selector) to select all elements
specific
-o-
rel="stylesheet"
*
49. Three common CSS3 pseudo-classes: first-child - last-child - _______
multiple selectors
only-child
http://html5shiv.googlecode.com/svn/trunk/html5.js
reset
50. Backwards compatibility for ________ & rounded corners & shadows -moz-border-radius & -moz-box-shadow
ul{ list-style: none;}
screen
-moz-
Firefox