HTML Block element & Inline element, along with understanding the implementation through the example. Every HTML document that render the web content, will depend on the element type i.e, block or inline which are default display values. We will understand both these concepts through the examples.
Example :
<!DOCTYPE html>
<html>
<body>
<div>Technosparkhub</div>
Checkout the Technosparkhub
<a href="https://technosparkhub.blogspot.com/"
alt="Technosparkhub">
official</a> website for the articles .
</body>
</html>
In the above example, we have used the <div> tag that always starts in a new line & captures the full width available. We have used the inline element anchor tag <a>that is used to provide a link to a text. The inline element doesn’t start in a new line & captures only the space around the element.
Block Level Elements: A block-level element always starts on a new line and stretches out to the left and right as far as it can i.e, it occupies the whole horizontal space of its parent element & the height is equal to the content’s height.
Inline Elements: An inline element is the opposite of the block-level element. It does not start on a new line and takes up only the necessary width ie., it only occupies the space bounded by the tags defining the HTML element, instead of breaking the flow of the content.
span element: The <span> tag is used as a container for text. It has no required attributes. Style, class, and id are the commonly used attributes.
Syntax:
<span>Technosparkhub</span>
div element: The <div> element is used as a container for other HTML elements. It has no required attributes. Style, class, and id are the commonly used attributes.
Syntax:
<div>Technosparkhub</div>
0 Comments