Html Div And Html Span Element

html div : basic

  • Html blocks:  By this tag you can grouped all html element. html div and html Span are used for this.
  • Tags for html blocks:  html div or <div> and html span or <span> tags are used for html blocks.
  • Inline elements: All inline tags are displayed without starting a new line. For example: <a>, <img>, <b>.

example of html div element:

The html div or <div> element can make group with all html element. The <div> element has no special meaning. At the time of designing web page with css <div> is a important tag.

Example:

<html>

<head><title>Div tag</title></head>

<div><h3>Paragraph</h3>

<p>This is a paragraph</p>

</div>

</html>

Here the html div tag or <div> tag make a group between <h3> and <p> tag. But all time this element can’t work. At the time of E-mail template design , the <div> tag can’t work.
Designing  html div tag:

<html>

<head><title>Div tag</title></head>

<div style="color:#00de54"><h3>Paragraph</h3>

<p>This is a paragraph</p>

</div>

</html>

Output: If you want to know about html color code or color name you can read this html color code article.

 

use of div tag

use of div tag

 

 

 

 

 

 

 

Span tag :

This element is an inline element. This can be used as a container for text. You can design or modify any single text or double text as you want.

Example:

<html>

<head><title>Div tag</title></head>

<h3><span style="color:#000de5;font-weight:bold">Paragraph</span></h3>

<p>This is a <span style="color:red;font-weight:bold">paragraph</span></p>

</html>

Output:

use of span

use of span

 

 

 

 

 

 

 

 

 

The following elements are block element for html4:

  • ADDRESS – Address
  • BLOCKQUOTE – Block quotation
  • CENTER – Centered block
  • DIR – Directory list
  • DIV – Generic block-level container
  • DL – Definition list
  • FIELDSET – Form control group
  • FORM – Interactive form
  • H1 – Level-one heading
  • H2 – Level-two heading
  • H3 – Level-three heading
  • H4 – Level-four heading
  • H5 – Level-five heading
  • H6 – Level-six heading
  • HR – Horizontal rule
  • ISINDEX – Input prompt
  • MENU – Menu list
  • NOFRAMES – Frames alternate content
  • NOSCRIPT – Alternate script content
  • OL – Ordered list
  • P – Paragraph
  • PRE – Preformatted text
  • TABLE – Table
  • UL – Unordered list

Learn about html forms and input on web page now.

Roy Jemee is a professional Blogger. Apart of blogging he likes to play with mathematics. He knows Blogging, Wordpress, PHP, javascript , SEO and some other.