A hypertext document by a website and displayed on the web browser to a user, the web page uses HTML elements that add semantics and formatting to parts of the document. <div> and <span> tags are both generic HTML elements used to mark two different parts of the web page. These tags are both utilised for structural and styling purposes. Here, we have analysed the Difference Between div And span Tag In HTML.
Here, in this article, we have made an attempt to describe these HTML elements:
- <div> (division element)
- <span> (span element)
What is a <div> tag in HTML?
The <div> or the division element is a generic HTML element utilised to divide the web page contents into blocks. Meanwhile, the block element of the pages begins a new line and is as wide as the entire page or the parent container. The <div> tag is often used to classify paragraphs, headings, images, and links. It is applicable for creating CSS based HTML layouts.
<div id= “paragraphs”>
<p> first paragraph content</p>
<p> second paragraph content</p>
What is a <span> tag in HTML?
The <span> generic inline element is used to stylise text. It applies styling to a section of the inline content. The inline element does not use a new line and will only occupy as much space as the text. These tags are applicable for small segments of text, images, links, and other HTML elements, which may appear inline with the surrounding content.
Example for <span> tag:
<p> she has <span id=“special- text”> extra content</span> inside it. </p>.
Difference Between div And span Tag In HTML?
Span and div are both generic HTML elements that group together related parts of a web page serving different functions. <div> is a block-level element and <span> is an inline element. Browser Support. Element. We can know more about what is the difference between <div> and <span> in HTML from the table below.
Difference Between div And span Tag In HTML
|Block element||Inline element|
|Used for CSS based HTML Layouts||Used to stylise text|
|Support align attribute, div tag displayed in new line||No align attribute, does not begin a new line|
|Used to wrap a section that requires highlighting||Wrap any particular word and to highlight it|
Keep learning and stay tuned to get the latest updates on GATE Exam along with GATE Eligibility Criteria, GATE 2023, GATE Admit Card, GATE Syllabus for CSE (Computer Science Engineering), GATE CSE Notes, GATE CSE Question Paper, and more.