What is an HTML element - Practice Questions & Exercises

Challenge - 5 Problems

🧠 Conceptual

intermediate

Identify the correct definition of an HTML element

Which option best describes what an HTML element is?

A A style rule that changes the color and font of text on a webpage.

B A script that runs in the browser to add interactivity to a webpage.

C A piece of content enclosed by opening and closing tags, possibly with attributes, that defines structure or meaning in a webpage.

D A file that contains images and videos used in a webpage.

💡 Hint

Think about what parts of HTML create the structure and content on a page.

An HTML element consists of a start tag, content, and an end tag. It can also have attributes. It defines parts of the webpage like paragraphs, headings, links, etc.

📝 Syntax

intermediate

Find the valid HTML element syntax

Which option shows a valid HTML element syntax?

A <p>This is a paragraph.</p>

B <p>This is a paragraph.

C <p>This is a paragraph.<p>

D p>This is a paragraph.</p>

💡 Hint

Check if the element has both opening and closing tags correctly placed.

A valid HTML element must have an opening tag and a matching closing tag. Option A correctly shows this.

❓ rendering

advanced

What will the browser display for this HTML element?

Given the HTML code below, what will the browser show on the page?

HTML

<strong>Welcome</strong> to the site!

A Welcome to the site! (all normal text)

B Welcome to the site! (with 'Welcome' in bold)

C <strong>Welcome</strong> to the site! (tags visible as text)

D Welcome to the site! (with 'to the site!' in bold)

💡 Hint

The tag makes text bold.

The tag makes the enclosed text bold. So only 'Welcome' is bold, the rest is normal.

❓ selector

advanced

Which CSS selector targets all HTML elements of type

?

You want to style all

elements on your page. Which CSS selector should you use?

A *article

B #article

C .article

D article

💡 Hint

Think about how to select elements by their tag name in CSS.

Using the tag name alone (article) selects all elements of that type. #article selects an element with id 'article', .article selects elements with class 'article'.

❓ accessibility

expert

Which HTML element and attribute combination improves accessibility for a navigation menu?

You have a navigation menu on your webpage. Which element and attribute combination best helps screen readers understand it?

A <nav aria-label="Main navigation">...</nav>

B <div id="nav">...</div>

C <section>...</section>

D <header role="banner">...</header>

💡 Hint

Consider semantic elements and ARIA labels for accessibility.

The

element is semantic for navigation. Adding aria-label="Main navigation" helps screen readers identify the menu purpose clearly.