VOOZH about

URL: https://www.geeksforgeeks.org/html/difference-between-div-and-span-tag-in-html/

⇱ Difference between <div> and <span> Tag in HTML - GeeksforGeeks

  • Courses
  • Tutorials
  • Interview Prep

Difference between <div> and <span> Tag in HTML

Last Updated : 12 Jul, 2025

In HTML, the <div> and <span> tags are used for structuring and styling content. <div> creates block-level containers for grouping elements, while <span> creates inline containers for styling specific portions of text or elements within a block-level container.

Syntax:

 <div>
 A Computer Science Portal for Geeks 
 <span>GeeksforGeeks</span>
</div>

HTML div tag

The div tag is known as the Division tag. The HTML <div> tag is a block-level element used for grouping and structuring content. It provides a container to organize and style sections of a webpage, facilitating layout design and CSS styling.

Note: Div tag has both opening(<div>) and closing (</div>) tags and it is mandatory to close the tag.

Example: In this example we uses <div> tags styled with CSS to create colored, block-level containers. Each div displays text "div tag" with white text on a green background, differentiated by margins and font size.

Output:

👁 div1image
Output

HTML span Tag

The HTML span element is a generic inline container for inline elements and content. It used to group elements for styling purposes (by using the class or id attributes). A better way to use it when no other semantic element is available.

Example: In this example the <span> tag's use for inline styling. It highlights "GeeksforGeeks" with a light green background, and "Publish" with blue color, emphasizing text within a paragraph.

Output:

👁 divspan
Output

Differences between <div> and <span> Tags

<div><span>
The <div> tag is a block level element.The <span> tag is an inline element.
It is best to attach it to a section of a web page.It is best to attach a CSS to a small section of a line in a web page.
It accepts align attribute.It does not accept align attribute.
This tag should be used to wrap a section, for highlighting that section.This tag should be used to wrap any specific word that you want to highlight in your webpage.
Comment