The elements in HTML are categorized into two categories : block-level elements and inline elements.
A block-level element always starts on a new line and takes the full width of a page, from left to right.
A block-level element can take one line or multiple lines and has a line break before and after the element.
The block level elements can contain block-level as well as inline elements.
Block level elements in HTML:
As the name says inline elements begin within a line, it does not start a new line.
Inline elements take only the necessary width.
By default inline elements start on the same line do not begin on the new line.
Inline elements in HTML:
HTML Grouping Elements:
There are two important tags which we use to group various HTML tags: the <div> tag and <span> tag.
The <div> Element:
In HTML the <div> tag is a division tag that is used to make divisions of content on the web page.
The <div> is a block-level element, so a line break is placed before and after it.
The <div> element is used to group HTML elements and to apply CSS styles to multiple elements at once.
You can place any HTML element inside <div> tag, including another <div>.
The <span> Element:
In HTML <span> tag is used for grouping inline elements and applying styles to those inline elements.
The main difference between <span> tag and <div> tag is that the <span> tag is used with inline elements while the <div> tag is used with block level content.