Introduction To HTML
Introduction To HTML
</body>
</html>
Example Explained
• The <!DOCTYPE html> declaration defines that this document is an HTML5 document
• The <html> element is the root element of an HTML page
• The <head> element contains meta information about the HTML page
• The <title> element specifies a title for the HTML page (which is shown in the browser's
title bar or in the page's tab)
• The <body> element defines the document's body, and is a container for all the visible
contents, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.
• The <h1> element defines a large heading
• The <p> element defines a paragraph
• What is an HTML Element?
• An HTML element is defined by a start tag, some content, and an end tag:
• <tagname> Content goes here... </tagname>
• The HTML element is everything from the start tag to the end tag:
• <h1>My First Heading</h1>
• <p>My first paragraph.</p>
HTML Documents
All HTML documents must start with a document type declaration: <!DOCTYPE html>.
The HTML document itself begins with <html> and ends with </html>.
The visible part of the HTML document is between <body> and </body>.
Example
<!DOCTYPE html>
<html>
<body>
</body>
</html>
The <!DOCTYPE> declaration represents the document type, and helps browsers to display web
pages correctly.
It must only appear once, at the top of the page (before any HTML tags).
<!DOCTYPE html>
HTML Headings
HTML headings are defined with the <h1> to <h6> tags.
<h1> defines the most important heading. <h6> defines the least important heading:
Example
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
HTML Paragraphs
Example
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
HTML Links
Example
<a href="https://www.facebook.com">This is a link</a>
HTML Images
The source file (src), alternative text (alt), width, and height are provided as attributes:
Example
<img src="photos.jpg" alt="Pictures.com" width="104" height="142">
HTML Elements
The HTML element is everything from the start tag to the end tag:
<tagname>Content goes here...</tagname>
Some HTML elements will display correctly, even if you forget the end tag:
Example
<html>
<body>
<p>This is a paragraph
<p>This is a paragraph
</body>
</html>
The <br> tag defines a line break, and is an empty element without a closing tag:
Example
<p>This is a <br> paragraph with a line break.</p>
HTML tags are not case sensitive: <P> means the same as <p>.
The HTML standard does not require lowercase tags, but it is recommended that you
use lowercase in HTML, and lowercase for stricter document types like XHTML.