Login | Contact Us | Site Map | Resources

CSS Quiz

Log in before taking this test if you want your score to be saved in order to receive a certification of achievement. If you are not yet a member, you can register free of charge.

1. Which of the following examples will position a layered element toward the top of the stack?

position: static;

top: -100px;

top: 100px;

z-index: -100;

z-index: 100;


2. What is the proper format of an CSS comment?

/* */

//

<! !>

<!-- -->


3. Which of the following examples will set multiple font properties for an entire webpage?

style="font: ;"

body { font-size: ; }

body { font: ; }

p { font-size: ; }

p { font: ; }


4. Which method is ideal for applying the same style to an entire website?

Internal CSS

Inline CSS

External CSS


5. What is the difference between margins and padding?

margins add whitespace inside the border and padding adds whitespace outside

padding adds whitespace and margins increase the border size

there is no difference

margins add whitespace and padding increases the border size

padding adds whitespace inside the border and margins add whitespace outside


Bonus Question: What is the shortest way to spell mousetrap?

E-E-K

T-R-A-P

H-A-T

M-O-U-S-E-T-R-A-P

C-A-T


6. Can images replace the numbers/bullets in both ordered and unordered lists?

Yes

No


7. What does CSS stand for?

Cascading Style Syntax

Common Style Syntax

Common Style Sheets

Central Style Shortcuts

Cascading Style Sheets


8. Can CSS classes and ids both be used (referenced) more than once on the same webpage?

Yes

No

Sorta


Bonus Question: Where do frogs keep their money?

In a pond.

In their purses.

In a river bank.

In their hats.


9. Is it possible to make the first character of an element look different than the other characters?

Yes

No

Maybe


10. From the inside out, which of the following portrays the correct order of a box model?

margin, border, padding, content

content, margin, border, padding

border, margin, content, padding

content, padding, border, margin

padding, content, margin, border


11. How would you set a background image with CSS?

background-attachment: url();

background-image: src();

background: #FFF url();

background-url: ;


12. "a:hover" and "a:active" are both examples of what?

pseudo-classes

attribute selectors

ids

selectors


13. Which of the following statements is not correct?

classes are identified a number sign (#)

classes are identified with a dot (.)

classes and ids are not used in inline CSS

ids are identified with a number sign (#)


14. What are floating elements?

clouds

clear: left;

elements that are pushed to the top or the bottom of a page

elements that are pushed to the right or the left of a page

elements that do not allow text to surround them


15. Which of the following is not correct CSS syntax?

p, h1, h2 { color: green; }

p { border= 1px dotted #000000; }

<p style="border: 1px dotted #000000;"> </p>

p { border: 1px dotted #000000; }


16. Which of the following is not a valid color code?

#505050

grey

808080

rgb(80, 80, 80)

#FFF


17. What does "text-transform: capitalize;" do?

Does it do this?

Does it do this?

Does it do this?

Does it do this?

Does it do this?


18. What does "margin-left: auto; margin-right: 0px;" do?

vertically aligns an element to the bottom of the page

horizontally aligns an element to the right of the page

horizontally aligns an element to the center of the page

vertically aligns an element to the top of the page

horizontally aligns an element to the left of the page


19. Which overflow value forces scrollbars to appear in an element even when unnecessary?

overflow: visible;

overflow: auto;

overflow: scroll;

overflow: hidden;


20. Which of the following does CSS not do?

layout

design

style

content

format


21. Internal CSS Is:

Maintained In A Separate File

Added Directly to An HTML Tag

Added to An HTML Document's Header


22. What is the proper syntax for changing the cursor style?

mouse-pointer: value;

cursor: value;

mouse-pointer { type: value; }

cursor { type: value; }