MCQS OF CSS(cascading style sheets)

1. What does CSS stand for?

a) Computer Style Sheets
b) Creative Style Sheets
c) Cascading Style Sheets
d) Colorful Style Sheets
Answer: c) Cascading Style Sheets

2. Which HTML tag is used to include CSS styles directly within an HTML
document?
a. <style>
b. <link>
c. <script>
d. <css>
Answer: a) <style>

3. Which CSS property is used to change the text color of an element?

a. text-color
b. color
c. text-style
d. font-color
Answer: b) color

4. How do you select an HTML element with the id attribute "header" in CSS?
a. #header
b. .header
c. header
d. <header>
Answer: a) #header

5. Which CSS property is used to control the spacing between lines of text
within an element?
a. padding
b. margin
c. line-height
d. spacing
Answer: c) line-height

6. Which HTML tag is used to include an external CSS file?

i. <style>
MCQS OF CSS(cascading style sheets)
ii. <link>
iii. <css>
iv. <script>
Answer: b) <link>

7. How do you comment out multiple lines of CSS in a stylesheet?

i. // This is a comment
ii. /* This is a comment */
iii. <!-- This is a comment -->
iv. // This is a comment //
Answer: b) / This is a comment /

8. Which CSS selector targets all elements of a specific type?

i. .class
ii. #id
iii. *
iv. element
Answer: d) element

9. What is the primary purpose of CSS selectors?

a. To define the structure of an HTML document
b. To style and select HTML elements for presentation
c. To create interactive web applications
d. To manage server-side logic
Answer: b) To style and select HTML elements for presentation

10. Which CSS selector selects all elements with a specific class attribute?
a. #element
b. .class
c. element.class
d. element > .class
Answer: b) .class

11. What is the purpose of the # symbol in a CSS selector?

a) It selects all elements of a specific type.
b) It selects elements with a specific class.
c) It selects a specific element by its ID.
d) It selects the parent element of a child element.
Answer: c) It selects a specific element by its ID.
MCQS OF CSS(cascading style sheets)
12. Which CSS selector is used to select all div elements that are children of a
section element?
a. section div
b. section > div
c. section + div
d. section ~ div
Answer: b) section > div

13. What is the purpose of the * selector in CSS?

1. It selects all elements in the HTML document.
2. It selects the first child element of a parent.
3. It selects elements with a specific attribute.
4. It selects elements with a specific class.
Answer: a) It selects all elements in the HTML document.

CSS Rules Overriding:

14.What is the correct order of CSS rule specificity, from highest to lowest?
1. Inline styles, ID selectors, Class selectors, Element selectors
2. ID selectors, Inline styles, Class selectors, Element selectors
3. Element selectors, Class selectors, ID selectors, Inline styles
4. Class selectors, ID selectors, Inline styles, Element selectors
Answer: b) ID selectors, Inline styles, Class selectors, Element selectors

15.If you have conflicting CSS rules for an element, which rule will take
precedence?
1. The rule with the highest specificity
2. The rule that appears first in the stylesheet
3. The rule with the lowest specificity
4. The rule with the most properties
Answer: a) The rule with the highest specificity

CSS Comments:

16.Which of the following is the correct way to write a CSS comment?

MCQS OF CSS(cascading style sheets)
1. <!-- This is a comment -->
2. /* This is a comment */
3. // This is a comment //
4. # This is a comment #
Answer: b) / This is a comment /

CSS Colors:

17.How can you specify the color "red" in CSS?

1. color: #FF0000;
2. color: red;
3. color: rgb(255, 0, 0);
4. All of the above
Answer: d) All of the above

18.Which CSS property is used to set the background color of an element?

1. background-color
2. color-background
3. background
4. background-style
Answer: a) background-color

CSS Backgrounds:

19.What is the correct way to set a background image in CSS?

1. background-image: url("image.jpg");
2. image-background: url("image.jpg");
3. set-background: url("image.jpg");
4. background: image("image.jpg");
Answer: a) background-image: url("image.jpg");

CSS Borders:

20.How can you set the border of an element to be a dashed line in CSS?
1. border-style: dashed;
2. border-line: dashed;
3. border: dashed;
4. border-design: dashed;
b. Answer: a) border-style: dashed;
MCQS OF CSS(cascading style sheets)
21.To set the width of a border in CSS, which property should be used?
1. border-size
2. border-width
3. border-thickness
4. border-height
b. Answer: b) border-width

22.What is the purpose of CSS margins?

1. To add space inside an element.
2. To add space outside an element.
3. To change the background color of an element.
4. To change the font size of an element.
b. Answer: b) To add space outside an element.

23.Which CSS property is used to create space inside an element?

1. margin
2. padding
3. border
4. width
Answer: b) padding

24.Which CSS property is used to set the width of an element?

1. margin
2. padding
3. height
4. width
b. Answer: d) width

25.What is the purpose of the CSS box-sizing property?

1. To control the margin of an element.
2. To specify the width of an element.
3. To control how an element's box model is calculated.
4. To change the font family of an element.
b. Answer: c) To control how an element's box model is calculated.
MCQS OF CSS(cascading style sheets)
26.What CSS property is used to change the marker (bullet or number) style of
a list item? a) list-style-image
b) list-item-marker
c) marker-style
d) list-item-style
Answer: a) list-style-image

27.Which CSS property is used to control the spacing between list items in an
unordered list?
1. list-item-spacing
2. list-spacing
3. margin
4. padding
Answer: c) margin

28.What CSS property is used to set the spacing between cells in a table?
1. table-spacing
2. cell-spacing
3. border-spacing
4. padding-spacing
Answer: c) border-spacing

29.Which CSS property is used to hide the border of a table?

1. border-collapse
2. table-border
3. border-hide
4. table-collapse
Answer: a) border-collapse

30.Which CSS display value is used to make an element take up the entire
width of its container?
1. block
2. inline
3. inline-block
MCQS OF CSS(cascading style sheets)
4. flex
Answer: a) block

31.What display value is used to hide an element but keep the space it
occupies?
1. hidden
2. none
3. visible
4. block
Answer: b) none

32.What is the purpose of the CSS float property?

1. It makes an element float on top of other elements.
2. It aligns text within an element to the left or right.
3. It clears the float of the previous element.
4. It removes an element from the document flow and makes it float
above other elements.
b. Answer: b) It aligns text within an element to the left or right.

33.What is the common use case for clearing a float in CSS?

1. To make an element invisible.
2. To prevent text from wrapping around a floated element.
3. To make an element clickable.
4. To apply a shadow effect to an element.
Answer: b) To prevent text from wrapping around a floated element.

34.What is the purpose of CSS?

a. To create dynamic web pages
b. To add interactivity to web pages
c. To define the presentation and layout of web pages
d. To store data on web servers

Answer: c. To define the presentation and layout of web pages

35.What is the default value for the "position" property in CSS?

MCQS OF CSS(cascading style sheets)
a. relative
b. absolute
c. fixed
d. static

Answer: d. static

36.What is CSS specificity?

a. A measure of how important a style is
b. A measure of how fast CSS rules are applied
c. A measure of file size of CSS files
d. A measure of the length of CSS selectors

Answer: a. A measure of how important a style is

37.Which CSS selector has the highest specificity?

a. ID selector
b. Class selector
c. Element selector
d. Universal selector

Answer: a. ID selector

38.In CSS, which property can be used to override a conflicting style rule?
a. !important
b. override
c. override-rule
d. specificity

Answer: a. !important

39.What is the result of the following CSS specificity calculation: 0, 1, 3, 0?

a. 1030
b. 3010
c. 0130
d. 1300
MCQS OF CSS(cascading style sheets)
Answer: b. 3010

40.Which CSS property is used to set the space between the content and the
border of an element?
a. margin
b. padding
c. border-spacing
d. spacing
Answer: b. padding

41.What does the "box-sizing" property control in CSS?

a. The size of the entire element box
b. The size of the content box
c. The size of the border box
d. The size of the margin box
Answer: c. The size of the border box

42.How can you make an element float to the left in CSS?

a. float: left;
b. align: left;
c. position: left;
d. layout: left;
Answer: a. float: left;
43.Which CSS property is used to create rounded corners for an element?
a. corner-radius
b. border-radius
c. border-style
d. edge-radius
Answer: b. border-radius

44.What is the default value of the "display" property in CSS for most
elements? a. inline
b. block
c. inline-block
d. none
Answer: b. block

CSS Positioning
MCQS OF CSS(cascading style sheets)
45.Which CSS property is used to make an element stick to the top of the
viewport when scrolling?
a. fixed
b. absolute
c. sticky
d. relative
Answer: c. sticky

46.What is the purpose of the "z-index" property in CSS?

a. It defines the background color of an element.
b. It determines the order in which elements are stacked in the z-axis.
c. It controls the font size of an element.
d. It sets the text alignment of an element.
Answer: b. It determines the order in which elements are stacked in the z-
axis.

47.Which CSS value can be used to hide an element without affecting the
layout?
a. display: block;
b. visibility: hidden;
c. opacity: 0;
d. position: absolute;
Answer: c. opacity: 0;

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

a. margin: auto;
b. text-align: center;
c. align: center;
d. position: center;
Answer: a. margin: auto;

49.What is the default position value for elements in CSS?

a. absolute
b. fixed
c. static
d. relative
Answer: c. static

CSS Typography
MCQS OF CSS(cascading style sheets)
50.Which CSS property is used to control the spacing between lines of text?
a. text-spacing
b. line-height
c. letter-spacing
d. word-spacing
Answer: b. line-height

51.What is the CSS property used to make text bold?

a. font-weight
b. text-style
c. font-bold
d. text-weight
Answer: a. font-weight

52.Which CSS property is used to set the style of underlined text?

a. text-decoration
b. text-style
c. text-underline
d. text-variant
Answer: a. text-decoration

53.How can you change the color of visited links in CSS?

a. a:visited { color: red; }
b. a.link-visited { color: red; }
c. a:link-visited { color: red; }
d. a:visited-link { color: red; }
Answer: a. a:visited { color: red; }

54.Which CSS property is used to control the capitalization of text?

a. text-transform
b. text-case
c. text-uppercase
d. font-case
Answer: a. text-transform

CSS Flexbox and Grid

55.What is the purpose of CSS Flexbox?

a. To create responsive images
MCQS OF CSS(cascading style sheets)
b. To create responsive tables
c. To create flexible layouts with a single-dimensional structure
d. To create animations
Answer: c. To create flexible layouts with a single-dimensional structure

56.Which CSS property is used to define the direction of flex items within a
flex container?
a. flex-direction
b. flex-flow
c. flex-wrap
d. flex-align
**Answer: