CSS Quiz 01

01. What does CSS stand for?

Cascading Style System

Cascading Sheet Styles

Cascading Style Sheets

Cascade Sheet System

Explanation: CSS stands for Cascading Style Sheets, used for designing web pages.

02. Which is the correct syntax to change the text color in CSS?

color: blue;

text-color: blue;

font-color: blue;

change-color: blue;

Explanation: The color property is used to set the text color in CSS.

03. How do you include an external CSS file in HTML?

<style src="styles.css">

<link rel="stylesheet" href="styles.css">

<css link="styles.css">

<import css="styles.css">

Explanation: The <link> tag with rel="stylesheet" is used to include external CSS files.The correct Answer is <link rel="stylesheet" href="styles.css">

04. Which property is used to set the background color?

bgcolor

background-color

set-background

color-background

Explanation: The background-color property is used to set the background color.

05. Which of the following is a valid CSS length unit?

px

kg

sec

Hz

Explanation: px is a unit for measuring length in CSS, commonly used for dimensions.

06. What is the default position value of an HTML element?

relative

absolute

fixed

static

Explanation: The default value for the position property is static.

07. How do you apply styles to a class in CSS?

.classname { }

#classname { }

classname { }

$classname { }

Explanation: Classes are styled using a dot . followed by the class name. Correct Answer is .classname { }

08. Which CSS property controls the text size?

font-size

text-size

size

text-font

Explanation: The font-size property is used to control text size.

09. How do you make a list not display bullets?

list-type: none;

list-style-type: none;

bullet-style: none;

list-bullet: none;

Explanation: The list-style-type property removes bullet points from lists.

10. What does the z-index property control?

Transparency

Rotation

Stacking order

Size

Explanation: z-index determines the stacking order of elements.

11. Which pseudo-class is used to style a link when it is hovered?

:visited

:active

:link

:hover

Explanation: The :hover pseudo-class applies styles when an element is hovered.

12. Which value is used to make an element invisible but still occupy space?

visibility: hidden;

display: none;

opacity: 0;

none of the above

Explanation: visibility: hidden; hides the element but keeps its space.

13. How do you make a font bold in CSS?

text-bold: true;

font-style: bold;

text-weight: bold;

font-weight: bold;

Explanation: The font-weight property adjusts the boldness of text.

14. Which CSS property adds space inside the border of an element?

margin

padding

spacing

border-spacing

Explanation: padding creates space inside the element's border.

15. What is the shorthand for setting padding values for all sides?

padding {top right bottom left}

padding-top: value;

padding: top right bottom left;

padding-shorthand;

Explanation: padding: top right bottom left; is shorthand for all sides.

16. How do you set a fixed background image?

image-fixed: true;

background-fixed: true;

fixed-background: yes;

background-attachment: fixed;

Explanation: The background-attachment property with fixed keeps the image stationary.

17. Which property specifies the space between lines of text?

line-height

spacing

text-spacing

line-spacing

Explanation: The line-height property adjusts the space between lines.

18. What does the inherit value do?

None of the above

Sets the default value

Removes the property

Copies the value from the parent element

Explanation: The inherit value copies the parent's value for a property.

19. What is the default display property of <div>?

inline

block

inline-block

flex

Explanation: By default, <div> elements have a block display property.

20. Which CSS framework is widely known for simplifying responsive web design?

Bootstrap

Tailwind

Materialize

All of the above

Explanation: Bootstrap is widely known for building responsive websites.

21. Which property is used for CSS grid layout?

grid-type

flex-columns

grid-template-columns

layout-grid

Explanation: grid-template-columns defines the column structure in CSS Grid.

22. How can you align text to the center of its container?

text-align: center;

align-text: center;

horizontal-align: center;

center-align: text;

Explanation: The text-align property with the value center horizontally aligns the text within its container.

23. What property is used to control the spacing between letters?

word-spacing

letter-spacing

line-spacing

text-spacing

Explanation: letter-spacing adjusts the space between characters.

24. What does the flex-grow property do in a flex container?

Aligns items

Adjusts item order

Shrinks the item

Defines the growth ratio of a flex item

Explanation: flex-grow defines how much an item should grow relative to others.

25. Which of the following is a pseudo-element in CSS?

:hover

::before

:focus

:visited

Explanation: The ::before pseudo-element inserts content before an element, adding decoration or supplementary content without altering HTML. In contrast, :hover, :focus, and :visited are pseudo-classes that apply styles based on an element's state (e.g., hover, focus, or visit).

Quiz Completed!

Your Score: 0/25