CCS3 Concepts

What is the main purpose of Flexbox in CSS3?

• Changing font styles

• Adding animations to elements

• Creating 3D effects

• Creating flexible layouts and aligning items within a container

Explain the difference between Grid Layout and Flexbox.

• Grid Layout is for mobile, Flexbox is for desktop.

• Grid Layout is vertical, Flexbox is horizontal.

• Grid Layout is two-dimensional, Flexbox is one-dimensional.

• Grid Layout is for text, Flexbox is for images.

How do Media Queries help in making a website responsive?

• Media Queries help in making a website responsive by allowing developers to apply different styles based on the characteristics of the device.

• Media Queries help in making a website responsive by adding more images

• Media Queries help in making a website responsive by increasing the font size

• Media Queries help in making a website responsive by changing the font color

What are Transitions in CSS3 and how are they used?

• Transitions in CSS3 are used to add audio effects to web pages

• Transitions in CSS3 are only applicable to text formatting

• Transitions in CSS3 are used to change property values smoothly over a specified duration. They are applied to elements when their state changes, such as when hovering over a button. Transitions are defined using the 'transition' property in CSS.

• Transitions in CSS3 are used to create 3D effects on elements

Describe how Animations can enhance user experience on a website.

• Animations slow down website loading speed

• Animations increase the risk of causing seizures in users

• Animations distract users from important content

• Animations make the website more engaging, provide visual feedback, guide users' attention, and create a sense of interactivity.

Why is Responsive Design important in modern web development?

• Responsive Design is not compatible with mobile devices.

• Responsive Design slows down website loading times.

• Responsive Design is only important for desktop users.

• Responsive Design ensures that websites look good and function properly on various devices such as smartphones, tablets, and desktops.

What are the different types of selectors available in CSS3?

• tag selectors, group selectors, pseudo-elements

• element selectors, class selectors, ID selectors, attribute selectors, universal selectors, descendant selectors, child selectors, adjacent sibling selectors, pseudo-elements

• element selectors, class selectors, ID selectors, attribute selectors, universal selectors, descendant selectors, child selectors, adjacent sibling selectors, pseudo-attributes

• element selectors, class selectors, ID selectors, attribute selectors, universal selectors, descendant selectors, child selectors, adjacent sibling selectors, pseudo-classes

How does the 'float' property work in CSS3?

• The 'float' property in CSS3 works by allowing an element to float to the left, right, or none, taking it out of the normal flow of the document.

• The 'float' property in CSS3 works by adding a shadow effect to an element

• The 'float' property in CSS3 works by centering an element horizontally on the page

• The 'float' property in CSS3 works by changing the font size of an element

Explain the concept of a box model in CSS3.

• The box model in CSS3 is used for creating 3D effects on web pages.

• The box model in CSS3 is a new feature introduced in HTML5, not CSS3.

• The box model in CSS3 describes the structure of elements on a web page, including content, padding, border, and margin.

• The box model in CSS3 only includes content and padding, excluding border and margin.

What are the different positions that can be used in CSS3 layout?

• dynamic

• floating

• stationary

• static, relative, absolute, fixed, sticky