HTML Block & Inline Elements

Block Elements

  1. <form>
  2. <div>
  3. <h1> – <h6>
  4. <p>

<div> Element

  • It is used as a container for other HTML elements.
  • It has not required attributes, but both style and class are common.
Program on <div> Element

<!DOCTYPE html>
<html>
<body>

<div style=”background-color:black;color:white;padding:20px;”>
<h2>Mumbai</h2>
<p>It would sound very clichéd to call Mumbai the New York of India, but that is what describes this city of dreams the best. </p>
<p>It depicts the place that is always up and about, a city with a spirit of gold and a determination to never say die, even in the wake of terrorist attacks and natural calamities.</p>
</div>

</body>
</html>

Output

Mumbai

It would sound very clichéd to call Mumbai the New York of India, but that is what describes this city of dreams the best.

It depicts the place that is always up and about, a city with a spirit of gold and a determination to never say die, even in the wake of terrorist attacks and natural calamities.

Inline Elements

  1. <span>
  2. <a>
  3. <img>

<span>

  • It is used as a container for some text.
  • It has not required attributes, but both style and class are common.
Output

<!DOCTYPE html>
<html>
<body>

<h1>My <span style=”color:blue”>Important</span> Heading</h1>

</body>
</html>

Output

My Important Heading

 

 

Leave a Reply

Your email address will not be published. Required fields are marked *