Answer these 200+ CSS 3 MCQs and see how sharp is your knowledge of CSS 3.
Scroll down and let's start!

1: To debug for Section 508 compliance you may want to check that all images contain alt tags. To do this you use:

A.   @media_query {alt:?}

B.   img:not([alt])

C.   find{alt}

2: True or False? The word-wrap and overflow-wrap properties have the same effects.

A.   True

B.   False

3: What CSS3 attribute is not correct

A.   scale()

B.   matrix()

C.   slide()

D.   all are right

E.   translate()

4: What is the common CSS3 trick used to trigger hardware acceleration on mobile devices?

A.   Use media queries

B.   Use 2D transforms (3D are not accelerated)

C.   Use 3D transforms (for 2D with Z axis set to 0)

D.   Use CSS Animations (exclusively)

E.   Use display:hw-accelerated

5: Have all of the CSS3 properties been implemented in the modern browsers?

A.   No

B.   All except Safari

C.   Yes

D.   All except Internet Explorer.

6: Which is a recognized media type?

A.   All of these

B.   screen

C.   handheld

D.   speech

7: We write single ______ before the pseudo-class property.

A.   colon

B.   hash

C.   dot

D.   semi colon

8: How can you apply a "bounce" effect to an element?

A.   Both answers are correct.

B.   Move it using "cubic-bezier", with greater values than normal.

C.   Create an animation which moves the element to a position transitionally, followed by another faster but shorter move, in the opposite diretion.

9: _____ positioned boxes are taken out of the normal flow.

A.   Relative

B.   Static

C.   Absolute

D.   Normal

10: If there is not enough room for a float on a line it is:

A.   shifted downward

B.   overlapping

C.   hidden

D.   shifted upward

11: What is the shorthand version of the CSS3 property transition?

A.   trans: property length effect speed

B.   transition-effect: attribute time swing count

C.   transition: attribute length effect speed

D.   transition: property duration timing-function delay

12: This code will affect: @media print {h1#first { position: static }

A.   print only

B.   all browsers as well as print

C.   all media devices except print

D.   none of these

13: To turn text into all uppercase, use:

A.   uppercase:

B.   text-transform:

C.   capitalize:

D.   any of these

E.   shout:

14: To specify the character encoding in an external stylesheet use:

A.   @charset

B.   @media

C.   !Important

D.   @import

15: You can specify the horizontal shadow, vertical shadow and the ______ distance in text-shadow.

A.   fade

B.   blur

C.   sharpe

D.   fadeout

16: How would you set a background image to not repeat?

A.   div { background-image: no-repeat; }

B.   div { image: no repeat; }

C.   div { background-repeat: no-repeat; }

17: With the emergence of CSS3, CSS2 has become:

A.   useless

B.   destandarized

C.   none of these

D.   defunct

18: Is @keyframes an method of animations in CSS3?

A.   Yes

B.   This is not a method at all of any CSS and only in Flash.

C.   No

19: what is the vendor prefix for internet explorer ?

A.   -mz-

B.   -ie-

C.   -moz-

D.   -ms-

20: Which of the following options below has the correct CSS syntax?

A.   p {color:red; text-align:center;}

B.   p {color:red; text-align:center}

C.   p {color:red; text-align:center};

D.   p (color:red;text-align:center;)

21: The correct way to select only inputs which are "disabled" is?

A.   Cannot be done with CSS3

B.   input:hidden

C.   input:disabled

D.   input:not('active')

E.   input:readonly

22: Webkit has it's own prefix and works in:

A.   IE

B.   Safari

C.   Webkit browsers only

D.   All browsers

23: Do "left", "top", "right" and "bottom" properties apply to all positioned elements?

A.   No, they are valid only for relatively positioned elements

B.   Yes

C.   No, they are valid only for absolutely positioned elements

24: To give the effect of using tables without actually using tables in the HTML use:

A.   display:block

B.   display:table

C.   display:column

D.   display:row

A.   none of these

B.   pseudo-class

C.   p tag

D.   iteration

26: li:nth-child(2n+1) { background-color: rgba(225, 0, 30, 0.8); } This code will:

A.   change the background color for each even numbered li tag

B.   combine two li tags on one line

C.   change the background color for each odd numbered li tag

D.   make the background color red

27: Whether or not a browser accepts a styling is called:

A.   browser sniffing

B.   browser support

C.   deprecated code

D.   hack

28: Use _____ to spread out the letters of each word in a sentence.

A.   letter-spacing

B.   align-right

C.   word spacing

D.   padding

29: Before using CSS3 declarations it is important to:

A.   be aware of the browser support

B.   turn off all other existing styles

C.   turn on CSS3 styling in the header

D.   run a CSS3 JavaScript

30: Is ::first-line a pseudo-element?

A.   True

B.   False

31: To create more space within a CSS3 button use:

A.   cell-padding

B.   margin

C.   cell-spacing

D.   padding

32: To have a box-shadow inside of the div use:

A.   inline

B.   outset

C.   stroke

D.   inset

33: Which one of these is not a font-weight descriptor in CSS3?

A.   200

B.   bold

C.   italic

D.   900

34: Is the following valid? "box-shadow: -5px -5px -5px #ccc;"

A.   No

B.   Yes

35: What does this code do? @import url("mystyle.css");

A.   links this stylesheet to the html page

B.   import style rules from other style sheets

C.   overrides all other stylesheet

D.   makes this shylesheet most important

36: Does CSS3 totally take over CSS2 or can the two be mixed?

A.   No

B.   mixed

C.   Yes

37: Which selector can be used to target every element on a page?

A.   body

B.   html

C.   $

D.   *

38: What are the 4 current vendor prefixes for css3 properties? (5 major desktop browsers, not mobile or tv)

A.   -moz, -wap, -xv, -epub

B.   -moz-, -webkit-, -o, -ms,

C.   -ff, -ch, -sf, -op, -ie

D.   -moz-, -web-kit-, -opera-, -micro-

E.   -ie, -fox, -apples, -oprah

39: In an unordered list, to turn off the bullets on the li tags use:

A.   list-style: none;

B.   li: none;

C.   list-type: none;

D.   display: none;

40: Is it true that the z-index property only applies to positioned elements?

A.   No

B.   Yes

41: True or False: The borders of an element can vary only up to 2 sides.

A.   False

B.   True

42: Opacity can cause an image to appear:

A.   to glow

B.   luminescent

C.   faded

D.   tilted

43: Using li:nth-child(odd) will:

A.   affect li tags with a class of nth-child

B.   add margin to every other li tag

C.   cause a border to occur

D.   affect only the odd numbered li tags

44: When styling for devices with 3-3.5 inch screen sizes it's best to use:

A.   max-borders

B.   media queries

C.   resolution finders

D.   screen shots

45: True or False: Due to CSS box model you cannot create a circle using CSS3.

A.   True

B.   False

46: CSS elements specified in a stylesheet should always end with ___________.

A.   a comma ( , )

B.   a colon ( : )

C.   a curly bracket ( } )

D.   a parenthesis ( ) )

47: What would 'p:first-child' be an example of?

A.   p tag

B.   pseudo-class

C.   iteration

D.   none of these

48: To set opacity of the background of an element, use:

A.   Color:#000(50%)

B.   Color:rgb(0,0,0,0.5)

C.   Background:rgb(#000 -30%)

D.   Background-color:rgba(0,0,0,0.5)

49: What property is used when creating custom fonts?

A.   Font[custom font]

B.   Custom-font

C.   @font

D.   @font-face

50: How would you cause an element to acquire the font-family of its parent element?

A.   font-family: accept;

B.   font-family: inherit;

C.   font: inherit;

D.   parent: inherit