HTML5 HTML5 Responsive Design and CSS Integration 2

Question 1

Which CSS property is used to create multi-column layouts without floats or positioning, introduced alongside HTML5?

Accepted Answer

display: flex

Answer

CSS Flexbox (display: flex) provides a one-dimensional layout model that makes it easy to align and distribute space among items in a container.

Question 2

What is the purpose of the HTML5 <template> element?

Accepted Answer

Holds client-side content that is not rendered but can be instantiated via JavaScript

Answer

The <template> element contains HTML that is not rendered when the page loads but can be cloned and inserted into the DOM by JavaScript.

Question 3

Which CSS unit, widely used in responsive HTML5 designs, is relative to the viewport width?

Accepted Answer

vw

Answer

The vw unit equals 1% of the viewport width, making it inherently responsive as it scales with the browser window size.

Question 4

What does the HTML5 'contenteditable' attribute do when set to 'true'?

Accepted Answer

Makes the element's content editable by the user

Answer

The contenteditable='true' attribute makes an element's content directly editable by the user in the browser, like a basic rich-text editor.

Question 5

Which CSS Grid property defines the number and size of columns in a grid container?

Accepted Answer

grid-template-columns

Answer

The grid-template-columns property defines the column track sizes of a CSS Grid layout using values like fr units, px, or repeat().

HTML5 - HTML5 Web Development Practice Test