HTML <div> and <span>

HTML block-level elements <div> and inline elements <span>

The block-level element width fills the entire browser visible area, generally only one block-level element in a row .

The width of the inline element is generally based on the text content within the element, and multiple inline elements can be placed in the block level element.


Let's take a look at the characteristics of the block-level element <div> and the in-row element <span>

Block level element <div>

Block-level elements are monopolized by one line. By default, the width automatically fills the width of the parent element. Therefore, multiple cross-level elements are displayed in multiple rows from top to bottom.

Block-level elements: div, p, form, ul, li, ol, dl, table ......

Inline element <span>

Inline elements do not occupy a single line, the width of which varies within the content inside, multiple inline elements will be placed next to each other, and will not wrap until one line does not fit.

Inline elements: span, strong, em, br, img, input, label, select, textarea, cite...

HTML grouping label

Label      Description
<div>Defines the area of ​​the document, block-level
<span>Used to combine inline elements in a document, inline elements (inline)
We learned so many tags before, and we will teach you how to use those tags to make a simple page layout. 

Last Updated: 2018-07-06 12:32:44 By akshay


share_facebook share_twitter share_google_plus

Please Comment Here :