Introduction to HTML
HTML Example
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>TutorialFish (TutorialFish.com)</title> </head> <body> <h1>My First Title</h1> <p>My First Paragraph</p> </body> </html>
Example analysis
<!DOCTYPE html> is declared as an HTML5 document
The <html> element is the root element of the HTML page
The <head> element contains the meta data of the document. For example, <meta charset="utf-8"> defines the web page encoding format as utf-8 .
The <title> element describes the title of the document
The <body> element contains the visible page content
The <h1> element defines a headline
The <p> element defines a paragraph
Note: On the browser page, use the F12 key on the keyboard to turn on the debugging mode, and you can see the composition tags.
What is HTML?
HTML is a language used to describe web pages.
HTML refers to Hyper Text Markup Language
HTML is not a programming language, but a markup language
Markup Language is a set of markup tags
HTML uses markup tags to describe web pages
HTML document contains HTML tags and text content
HTML documents are also called web pages
HTML Tags
HTML tag tags are usually called HTML tags (HTML tags).
HTML tags are keywords surrounded by angle brackets , such as <html>
HTML tags usually appear in pairs , such as <b> and </b>
The first tag in the tag pair is the start tag , and the second tag is the end tag
Start and end tags are also called open tags and closed tags
<label>content</label>
HTML Elements
"HTML tags" and "HTML elements" usually have the same meaning.
But strictly speaking, an HTML element contains a start tag and an end tag, as in the following example:
HTML elements:
<p>This is a paragraph.</p>
Web Browser
Web browsers (such as Google Chrome, Internet Explorer, Firefox, Safari) are used to read HTML files and display them as web pages.
The browser does not directly display HTML tags, but you can use tags to decide how to display the content of the HTML page to the user:
HTML Page Structure
The following is a visual HTML page structure:
<html> <head> <title>page title</title> </head> <body> <h1>This is a headline</h1> <p>This is a paragraph.</p> <p>This is another paragraph.</p> </body> </html>
 | Only the <body> area will be displayed in the browser. |
|---|
HTML Version
Since the birth of the Internet in the early days, many HTML versions have appeared:
| Version | Release time |
|---|---|
| HTML | 1991 |
| HTML+ | 1993 |
| HTML 2.0 | 1995 |
| HTML 3.2 | 1997 |
| HTML 4.01 | 1999 |
| XHTML 1.0 | 2000 |
| HTML5 | 2012 |
| XHTML5 | 2013 |
<!DOCTYPE> Declaration
The <!DOCTYPE> declaration helps to display the web page correctly in the browser.
There are many different files on the Internet. If the HTML version can be correctly declared, the browser can correctly display the content of the webpage.
The doctype declaration is case-insensitive, and the following methods are available:
<!DOCTYPE html> <!DOCTYPE HTML> <!doctype html> <!Doctype Html>
General Statement
HTML5
<!DOCTYPE html>
HTML 4.01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
XHTML 1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
View the complete web page declaration type DOCTYPE reference manual. (Under Construction)
I18N Encoding
At present, in most browsers, I18N is garbled characters will appear when outputting i18N directly. At this time, we need to declare the characters as UTF-8 or specific encoding in the header.
Example
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Page title</title> </head> <body> <h1>My first title</h1> <p>My first paragraph.</p> </body> </html>