CSSD Quiz for Grade 14 Students

What is the purpose of CSS selectors?

• CSS selectors are primarily used for server-side scripting.

• The purpose of CSS selectors is to target specific HTML elements and apply styling to them.

• CSS selectors are used to create animations on a webpage.

• The purpose of CSS selectors is to generate dynamic content.

Explain the box model in CSS.

• The box model in CSS includes elements, padding, border, and margin.

• The box model in CSS includes content, padding, border, and shadow.

• The box model in CSS includes text, padding, border, and margin.

• The box model in CSS includes content, padding, border, and margin.

How does the grid layout work in CSS?

• The grid layout in CSS is used for styling text only

• The grid layout in CSS divides a webpage into rows and columns, enabling easy element placement and alignment using properties like 'grid-template-rows', 'grid-template-columns', and 'grid-gap'.

• Grid layout in CSS is a deprecated feature

• Grid layout in CSS does not support responsive design

What are media queries used for in CSS?

• Media queries are used to add animations to images

• Media queries are used to apply different styles based on the characteristics of the device or browser viewing the page.

• Media queries are used to play videos on a webpage

• Media queries are used to change the font size of text

Describe how animations can be implemented in CSS.

• Animations are implemented in CSS by using JavaScript functions

• Animations in CSS are achieved by using inline styles

• CSS animations are created by defining classes with animation properties

• Keyframes are defined using the @keyframes rule, specifying the animation name and the keyframe percentages with the styles to be applied. Then, the animation is applied to an element using the animation property, specifying the animation name, duration, timing function, delay, iteration count, direction, fill mode, and play state.

What is the difference between class and ID selectors in CSS?

• Class selectors are used for HTML elements, while ID selectors are used for CSS elements.

• Class selectors can be used multiple times, while ID selectors should be unique.

• Class selectors are more specific than ID selectors.

• Class selectors are defined with a period (.), while ID selectors are defined with a hashtag (#).

How can you center an element horizontally in CSS?

• margin: 0 auto;

• padding: 0 auto;

• text-align: center;

• display: flex; justify-content: center;

What are the main components of the box model?

• margin, content, padding, border

• padding, border, margin, content

• content, padding, border, margin

• content, padding, border, padding

What is the 'display' property used for in CSS?

• The 'display' property in CSS is used to change the font size of an HTML element.

• The 'display' property in CSS is used to add a border around an HTML element.

• The 'display' property in CSS is used to apply animations to an HTML element.

• The 'display' property in CSS is used to specify the type of box used for an HTML element.

Explain the concept of responsive design in relation to media queries.

• Responsive design uses JavaScript instead of CSS media queries.

• Responsive design ensures that websites look good and function well on various devices by using CSS media queries to adjust layout and styling.

• Responsive design focuses on optimizing websites for desktops only.

• Responsive design does not consider user experience on different devices.