Modern HTML and CSS from the Beginning (Including Sass) - Block & Inline Level Elements

The video tutorial explains the difference between block and inline elements in HTML. Block elements, such as paragraphs and lists, span the full width of a page and push subsequent elements to the next line. Inline elements, like links and spans, only take up as much space as needed, allowing other elements to appear beside them. The tutorial includes practical examples and discusses styling with CSS, emphasizing the importance of understanding these concepts for web development.

Which of the following is a block level element?

• button

• span

• h1 (heading)

• a (link)

What is a characteristic of inline elements?

• They have default margins.

• They only take up as much width as necessary.

• They start on a new line.

• They span the full width of the page.

In the HTML example, what happens when a second paragraph is added?

• It is placed on a new line below the first paragraph.

• It is hidden by default.

• It appears next to the first paragraph.

• It overlaps with the first paragraph.

What is the purpose of adding a border in the HTML example?

• To align the elements to the center.

• To change the element's color.

• To make the text bold.

• To visualize the element's boundaries.

How can you change an element from block to inline using CSS?

• By using the 'float' property.

• By changing the element's color.

• By adding a border.

• By using the 'display: inline' property.

What is an inline-block element?

• An element that behaves like an inline element.

• An element that combines characteristics of both block and inline elements.

• An element that behaves like a block element.

• An element that is hidden by default.

Which of the following is an inline element?

• strong (bold text)

• div

• li (list item)

• ul (unordered list)