HTML CSS Basics Assessment -1

The CSS Property used to make the text bold is:

• font-style

• font-weight

• font-size

• font-bold

How to select the elements with their class name "container" ?

• #container

• container

• $container

• .container

What model includes margin, border, padding, and content?

• CSS Box model

• CSS3 Flexbox Box model

• CSS3 Grid Layout model

• CSS Grid Template Layout Module

Which CSS property allows you to control how the total width and height of an element is calculated?

• width-height

• box-dimension

• box-sizing

• element-sizing

Which CSS property is commonly used to horizontally center an element within its parent?

• text-align

• align-content

• justify-content

• margin: 0 auto;

In CSS, what is the difference between an ID and a class selector?

• IDs are for styling multiple elements, while classes are for single elements.

• IDs are for single elements, while classes are for styling multiple elements.

• IDs and classes can be used interchangeably.

• IDs and classes have no difference in CSS.

Which type of gradient transitions between two or more colors in a linear pattern?

• Linear gradient

• Radial gradient

• Diagonal gradient

• Circular gradient

What is the default display value for a <div> element in CSS?

• inline

• inline-block

• block

• flex

You want to ensure that an element with the class "box" has a width of 300px, including padding and border. Which CSS rule accomplishes this?

• .box { width: 300px; box-sizing: content-box; }

• .box { width: 300px; box-sizing: padding-box; }

• .box { width: 300px; box-sizing: border-box; }

• .box { width: 300px; box-sizing: margin-box; }

How can you center an element with the class "centered" both horizontally and vertically within its parent using CSS?

• .centered { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

• .centered { position: relative; top: 50%; left: 50%; transform: translate(50%, 50%); }

• .centered { position: fixed; top: 0; left: 0; margin: auto; }

• .centered { display: flex; align-items: center; justify-content: center; }