Key Differences Between Blockline and Inline Elements

In HTML elements have most default display values, depending on the what type element it is.

They are two types of elements:

1) Inline Element

2) Block Element

1)Inline elements:

An inline element are a part of main text. do not start on a new line. they only take as much as width is needed within the space defined by the main element.

Example: anchor tags<a>,image tag<img>,<span>,input elements, sub, super

General Inline element is "span".

2)Block Elements:

A Block element which always starts on a new line and browser automatically add some space before and after the element.

Block Elements doesn't allow any element beside them.

General Block element is "div".

<div> makes the group/sections.

Examples: <p>,<address>,<dl>,<dd>,<ol>,<ul>

Class and Id's:

Each and every element in html will be given a name .(class or id)

Class are like general names element can have more than one classname and multiple classes can have same class name.

Example:<div class="abc">. // have one name//

<div class="abc","xyz"> //multiple names//.

But the Id's are different

Id's should have a unique value.one element should have a unique id no other should have the same Id. Id's are like unique values.

Example:<div id ="ab">. //unique one//

Semantic Element:

These are used for better understanding of SEO.

Example: header, footer, main, section, article ,address ,nav .

Address will change the font of the text other will not make any differences.

Emmets: are the set of plug-ins for the text editors that helps the developer write HTML and CSS more effectively.