CSS MCQ

1. What does CSS stand for?

a) Creative Style Sheet

b) Computer Style Sheet

c) Colorful Style Sheet

d) Cascading Style Sheet

Answer: d

2. Which HTML tag is used to link an external CSS file to an HTML document?

a) <style>

b) <link>

c) <css>

d) <external>

Answer: b

3. What is the correct syntax to select an HTML element with the id "header" in CSS?

a) #header

b) .header

c) element#header

d) .header#

Answer: a

4. Which property is used to change the font of an element in CSS?

a) font-family

b) font-style
 c) font-size

d) text-font

Answer: a

5. Which CSS property is used to control the spacing between lines of text?

a) line-spacing

b) text-spacing

c) line-height

d) spacing

Answer: c

6. How can you apply a border to an element using CSS?

a) border: 1px solid black;

b) element-border: 1px solid black;

c) border-style: solid;

d) style.border: 1px black;

Answer: a

7. What does the "Cascading" in CSS refer to?

a) The process of blending colors

b) The way browsers render styles

c) The ability to override styles from different sources

d) The use of cascading waterfalls in design

Answer: c
8. Which CSS property is used to control the spacing between individual characters?

a) text-spacing

b) character-spacing

c) letter-spacing

d) space-between

Answer: c

9. How can you center an element horizontally in CSS?

a) align: center;

b) text-align: center;

c) horizontal-align: center;

d) margin: auto;

Answer: b

10. Which CSS selector targets elements that are children of a specific element?

a) >

b) :

c) ~

d) +

Answer: a

11. Which CSS property is used to control the color of text?

a) color

b) text-color

c) font-color
 d) style.color

Answer: a

12. What is the purpose of the CSS property "float"?

a) To create a floating element on the page

b) To move an element to the right

c) To control the transparency of an element

d) To control the alignment of an element

Answer: a

13. Which CSS property is used to control the size of an element's margin?

a) margin-size

b) padding

c) space

d) margin

Answer: d

14. Which CSS property is used to control the size of an element's padding?

a) padding-size

b) margin

c) space

d) padding

Answer: d

15. Which CSS property is used to control the display behavior of an element?
 a) display-mode

b) visibility

c) display

d) show

Answer: c

16. What is the purpose of the CSS property "position"?

a) To change the color of an element

b) To control the position of an element on the page

c) To add animation effects to an element

d) To define the size of an element

Answer: b

17. Which CSS value is used to make an element transparent?

a) solid

b) opaque

c) transparent

d) visibility: hidden;

Answer: c

18. How can you select all paragraphs with the class "intro" in CSS?

a) .intro

b) intro

c) #intro

d) p.intro
 Answer: d

19. What does the "box model" in CSS refer to?

a) A design concept for creating visually appealing boxes

b) The way browsers render elements on a web page

c) The combination of margin, border, padding, and content of an element

d) A model used for creating 3D animations

Answer: c

20. Which CSS property is used to control the background color of an element?

a) background-color

b) bgcolor

c) color-background

d) style.background-color

Answer: a

21. How can you apply a background image to an element in CSS?

a) image: url('image.jpg');

b) background-img: url('image.jpg');

c) background-image: url('image.jpg');

d) img: background('image.jpg');

Answer: c

22. What is the purpose of the CSS property "overflow"?

a) To control the rotation of an element

c) To create a shadow effect

d) To control the transparency of an element

Answer: b

23. Which CSS property is used to control the order of flexible items in a flex container?

a) order

b) flex-order

c) flex-ordering

d) item-order

Answer: a

24. How can you change the text color of a link that has been visited?

a) a:visited { color: red; }

b) a.visited { color: red; }

c) a.link-visited { color: red; }

d) a.color-red { visited: true; }

Answer: a

25. Which CSS property is used to control the spacing between columns of a multi-column layout?

a) column-gap

b) gap

c) column-spacing

d) space-between-columns

Answer: a
26. What is the purpose of the CSS property "transform"?

a) To create a transition effect between two states of an element

b) To move an element to a new position

c) To apply 3D transformations to an element

d) To change the font style of an element

Answer: c

27. How can you select all elements of the class "highlight" that are descendants of a <div> element with
the id "container"?

a) #container .highlight

b) .highlight #container

c) div.highlight

d) #container > .highlight

Answer: a

28. Which CSS property is used to control the order of layers in a 3D space?

a) layer-order

b) z-index

c) depth

d) order

Answer: b

29. How can you apply different styles to different media types using CSS?

a) Using the @style rule

b) Using the @media rule

) Using the media-type attribute

Answer: b

30. What is the purpose of the CSS property "transition"?

a) To control the timing of animations

b) To change an element's position

c) To create a gradient background

d) To adjust the spacing between elements

Answer: a

31. Which CSS property is used to control the shape of the corners of an element?

a) corner-radius

b) border-curve

c) border-radius

d) corner-shape

Answer: c

32. What is the purpose of the CSS property "opacity"?

a) To change the background color of an element

b) To control the visibility of an element

c) To create a drop shadow effect

d) To control the transparency of an element

33. How can you apply different styles to different states of a button, such as hover and active?

a) button:hover { }

b) button.active { }

c) button[state="hover"] { }

d) button[state="active"] { }

Answer: a

34. Which CSS property is used to control the alignment of text within an element?

a) text-align

b) alignment

c) align

d) text-alignment

Answer: a

35. How can you create a smooth transition effect between two CSS property values?

a) smooth-transition: property value;

b) property-transition: smooth value;

c) transition: property value smooth;

d) transition: property duration timing-function;

Answer: d

36. What is the purpose of the CSS property "box-shadow"?

a) To create a border around an element

c) To create a gradient background

d) To control the margin of an element

Answer: b

37. Which CSS property is used to control the width of an element's border?

a) border-width

b) border-size

c) width-border

d) border-line

Answer: a

38. How can you apply a style to an element when a user hovers over it?

a) element:hover { }

b) element.hover { }

c) element:active { }

d) element:focus { }

Answer: a

39. Which CSS property is used to control the space between columns in a multi-column layout?

a) column-space

b) column-gap

c) column-margin

d) gap

Answer: b
40. What is the purpose of the CSS property "text-transform"?

a) To control the spacing between characters

b) To transform text into a different font

c) To control the visibility of text

d) To change the capitalization of text

Answer: d

41. How can you select the first child element of a parent element in CSS?

a) parent:first-child { }

b) parent:first { }

c) parent > child:first { }

d) parent > child:first-child { }

Answer: d

42. Which CSS property is used to control the amount of space between an element's content and its
border?

a) spacing

b) padding

c) margin

d) gap

Answer: b

43. What is the purpose of the CSS property "text-decoration"?

a) To change the font style of text

b) To add a border around text

d) To add visual effects to text, like underline or strike-through

Answer: d

44. How can you create a responsive design using CSS?

a) Using the @viewport rule

b) Using the @responsive rule

c) Using media queries

d) Using the viewport-size property

Answer: c

45. Which CSS property is used to control the size of an element's text?

a) text-size

b) font-size

c) size

d) text-font

Answer: b

46. What is the purpose of the CSS property "display: none;"?

a) To make an element invisible

b) To create a hidden background image

c) To display an element as a block

d) To create a hidden border

Answer: a
47. How can you apply a background color to an element in CSS?

a) background-color: color;

b) element-bg: color;

c) bg-color: color;

d) color-background: color;

Answer: a

48. Which CSS property is used to control the alignment of flex items along the cross-axis?

a) flex-align

b) cross-align

c) justify-content

d) align-items

Answer: d

49. What is the purpose of the CSS property "clear"?

a) To control the alignment of an element

b) To clear the contents of an element

c) To create a line break

d) To control the positioning of an element in relation to floated elements

Answer: d

50. How can you apply a style to all elements with the class "important" inside a <div> element?

a) div.important { }

b) div > .important { }

c) .important div { }
d) div .important { }

Answer: d