Html
What is the difference between HTML tags <p> and <div>?
both <div> and <p> are block-level elements which means that most browsers will treat them in a similar fashion.
They have semantic difference -
<p> element is designed to describe a paragraph of content, and has semantic meaning.
<div> is simply a block container for other content, is designed to describe a container of data.
The semantics make all the difference. HTML is a markup language which means that it is designed to "mark up" content in a way that is meaningful to the consumer of the markup.
The elements that you choose to mark up your content should describe the content. Don't mark up your document based on how it should look - mark it up based on what it is.
If you need a generic container purely for layout purposes then use a <div>.
If you need an element to describe a paragraph of content then use a <p>.
They are not interchange -
You cannot nest a <p> inside another <p>. Anything that can go in a <p> can go in a <div> but the reverse is not true. <div> tags can have block-level elements as children. <p> elements cannot.
The major web browsers will render a <p> tag with margin above and below the paragraph. A <div> tag will be rendered without any margin at all. If you want to control rendering, you should be using CSS. Don't rely on browsers' current defaults.
HTML5
The HTML5 syntax is no longer a part of SGML despite the similarity of its markup. It has, however, been designed to be backward compatible with common parsing of older versions of HTML. It comes with a new introductory line that looks like an SGML document type declaration, <!DOCTYPE html>, which triggers the standards-compliant rendering mode.
HTML5 introduces elements and attributes that reflect typical usage on modern websites.
