Special Tags: DIV and SPAN
<div> tag is a block, meaning it puts a line break before and after it. It divides a document
into smaller discrete blocks of content, grouping other tag elements like a headline (
<p>) and even other
<div> elements. The
<div> can be
turned into an HTML editor by setting the
contenteditable attribute to
true. For example:
<span> tag is inline to a block of text.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Hello, World</title> </head> <body> <div id="header"> <img alt="company logo" width=110 height=50 src="companylogo.gif" /> </div> <div id="main"> <h1>Document Heading</h1> <p><cite>Hello, World!!!</cite></p> <p>This is inline <code>programming code</code>. This is a <a href="http://www.google.com/">link to Google</a>. </p> <pre> //this is a block of programming code int x = 3 + 2 * 4; // comment</pre> <ol> <li>bullet 1</li> <li>bullet 2</li> <li>bullet 3</li> </ol> <blockquote> this is a block quote </blockquote> </div> <div id="footer"> <small>Copyright 2007 (this is small text)</small> </div> </body> </html>
This is inline
programming code. This is a link to Google.//this is a block of programming code int x = 3 + 2 * 4; // comment>
- bullet 1
- bullet 2
- bullet 3this is a block quoteCopyright 2007 (this is small text)
New HTML5 Tags
There are several new HTML5 specific tags.
<summary> tags are self-explanatory.
<section> tag is a grouping of related content.
<article> tag contains a complete composition, or an "article", so it, too, is self-explanatory.
<main> tag is for the main content of the document and my contain several articles or none at all. There would typically be only one of these tags in a document.
<aside> tag is to or toward the side of the main article.
<nav> tag is used to contain navigation links.
<figure> tag is used for an illustrative figure. An
<img> tag can be used inside it and
<figcaption> is also used inside it which explains the photo or illustration.
<time> tag flags a valid date or time in the document's text. It has two attributes:
pubdate. For example:
<time datetime="2014-01-01 17:00" pubdate>Jan 1st at 5:00 p.m.</time>.
pubdate refers to the publication date of the article or document, if applicable.
<mark> tag is used to highlight text.