ankitweblogic logo
W e b t u t o r i a l s

Define Website

Define HTML

HTML, Head, Title tag

HTML Body tag

HTML Heading tags

HTML Paragraph tag

HTML Horizontal Line

HTML Hyperlink

HTML Image tag

HTML Font tag

HTML Exercise

HTML Text Direction

HTML Comment

HTML Lists

HTML Marquee tag

HTML Table tag

HTML Table Website

HTML Frame

HTML Iframe

HTML Fieldset tag

HTML Form Elements

HTML Form Exercise

HTML Image Map

HTML Div & Span Tag

CSS Float & Clear

HTML Color Codes

HTML Symbols

HTML Assignment

Div Tag

Unlike other HTML tags, these 2 tag display nothing unless CSS Properties are applied. The <div> and <span> tag allow you to group together several elements to create sections or subsections of a page.

Example 1: Using Div tag divide the page into sections.

Example 2: Using Div tag divide the page into sections.

Span Tag

The <span> tag can be used to group inline elements only. So, if you have a part of a sentence or paragraph which you want to group together with some formatting style, than you can use the <span> element as follows:

Example: Span tag.


Difference between Div and Span Tag

The difference between div and span is that Div tag is a block tag and Span tag is a inline tag means Div tag break the line whereas span tag continue in a single line.

Example: Difference between Div and Span Tag.

<html>
  <head>
    <style>
        div, span {
        color:red;
        background:yellow;
        font-style:italic;
      }
    </style>
  </head> 
  <body>
    <p>
      Text before the Div tag
      <div> I am a Div </div>
      Text after the Div tag.
    </p>
    <p>
      Text before the span tag
      <span> I am a span </span>
      Text after the span tag.
    </p>
  </body>
</html>

Output