Inline VS Block Elements(lt.7)
Inline tags : They are used to format text within a line. They do not start on a new line or take up the full width of their container.
ex: <div>
, <p>
, <h1>
, <ul>
, <li>
......
Uses: They are used for styling and formatting text within the content.
Block tags : They start on a new line and take up the full width of their container.
ex: <span>
, <a>
, <strong>
, <em>
, <img>
......
Uses: They are typically used to structure the main content of a web page, such as paragraphs, headings.
Code to demostrate it:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=\, initial-scale=1.0" />
<title>BLOCK AND TITLE</title>
</head>
<body>
<h1>also block level</h1>
<h1>BLOCK LEVEL</h1>
<hr>
<p> <b>BLOCK </b>Animals are </p>
<p> <b>from here</b>Locing elit. Dolorem, magnam.</p>
<span> <b>INLINE </b>Aniganisms in the biological kingdom With</span>
<span> <b>from here</b>Lorem ipsuit. Dolorem, magnam.</span>
</body>
</html>