HTML Inline and Block Element

What is HTML Element?

• An HTML element is the fundamental building block of a webpage that tells a web browser how to structure, format, and display content.

• The HTML element is everything from the start tag to the end tag.

Example:

       <h1>My First Heading</h1>

HTML elements are mainly divided into two types:

• Block Elements

• Inline Elements

Block Elements

• A block element always starts on a new line and takes up the full available width by default.

Block Elements: <div>, <p>,<h1>–<h6>, <ul>, <li>, <header>, <footer>, and <section>.

<h1>Welcome</h1>
<p>Hello</p>
<div>Content</div>

Output:
Welcome
Hello
Content

Inline Elements

• An inline element does not start on a new line.It only takes up as much width as its content needs.

Inline Elements: <span>, <a> (hyperlinks), <strong>, <em>, <img>, and <button>.

<span>Hello</span>
<span>World</span>

Output:Hello World

Diagram of HTML Elements: