HTML web pages contain many elements and tags. Both `div` and `span` tags represent a part of any webpage.

# `div` tag 
The **`div` tag** is mainly used to divide up content on the web page. Since the `div` tag is a block element, the entire width of the block is assigned to the `div` element. 
>If you apply a `div` to a text paragraph, the entire block of the page will become part of the `div`. 

# `span` tag

The **`span` tag** is referred to as a generic inline container -- it can target a specific text in a paragraph and apply styling attributes. This is done through the `class` or `id` attributes of the `span`.  

<!DOCTYPE html> 
<html> 
<head> 
	<title>Div and span tags</title> 
	<style> 
		div { 
			color: white;  
			font-size: 28px; 
      background-color: #000000; 

		} 
	</style> 
</head> 
<body> 
	<h2> Div tag </h2>
	<div> 
		<p>Educative contains text-based courses with embedded coding environments help you learn without the fluff.</p>
		<p>Gain in-demand skills now. <p>
	</div> 
	<h2> Span tag </h2>
	<p><span style="background-color:yellow">  
        Welcome to Educative</span> It is a great platform.</p> 
</body> 
</html> 

codemirror

As you can see, the text with the 'black' background is part of the `div` -- it contains the entire width of the page. However, the part of the sentence "Welcome to educative", with the yellow background, is part of a `span`. We can use `span` to apply styling to only this sentence rather than the entire content. 

What is the difference between div and span?

div tag

span tag

Code

`div` tag

`span` tag