What are inline and block elements in HTML | Difference between inline and block elements | Inline Element Examples | Block Elements Examples

What are inline and block elements in HTML and the difference between them? Name a few inline elements and block elements.

Ans:

Inline Elements:

• A line break is not used to begin an inline element.

• It uses the space that is required.

• An inline element will not start on a new line and only take up as much width as necessary.

• Some examples of the inline element are-

  <a> <abbr> <input> etc

Block Elements:

• A block-level element always begins on a new line and browsers add a space before and after the element.

• A block-level element always occupies the entire available width of the webpage i.e it stretches out to the left and right as far as possible.

• <p> <div> are commonly used block elements and will start in a new line and take up the full width available.

• Some other examples of block-level elements are:

  <h1>-<h6> <form> <video> <fieldset> etc