It is very much important for a web developer to know the characteristics of each elements in HTML. This article briefly explains the difference between the Block elements and the Inline elements in HTML.
Block Elements:
Following are the some of the main features of a block level element.
- An element that takes up full width available, and
- Has a line break before and after it.
Some of the sample elements would be:
<h1> <h2> <p> <ul> <ol> <li> <div>
Inline Elements:
Following are some of the features of and inline element
- An element which takes up only as much width as necessary, and
- Does not force line breaks before and after the elements.
Some of the sample elements would be:
<span> <a> <b> <strong> <i>
NOTE:
By changing the “display” attribute of these elements, we can achieve the specific requirements. The following is the example using CSS.
li {display:inline} span {display:block}