English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

HTML Basic Tutorial

HTML Media

HTML Reference Manual

HTML5 Basic Tutorial

HTML5 API

HTML5 Media

What is HTML

HTML is known as HyperText Markup Language, which is an identification language. It includes a series of tags. These tags can unify the format of online documents and connect scattered Internet resources into a logical whole. HTML text is composed of HTML commands, which can describe text, graphics, animations, sounds, tables, links, and more.

<!DOCTYPE　html>
<html>
<head>
<meta　http-equiv="Content-Type" content="text/html;charset=utf-8"　/>
<title>Basic Tutorial(oldtoolbag.com)</title>
</head>
<body>
<h1>My first web page title</h1>
<p>My first web page paragraph.</p>
</body>
</html>
Test and See ‹/›

Example parsing

  • <!DOCTYPE html> declaration is for HTML5 Document

  • The <html> element is the root element of an HTML page

  • The <head> element contains document metadata, such as <meta charset="utf-8"> defines the web page encoding format as utf-8.

  • The <title> element describes the document title

  • The <body> element contains visible page content

  • <h1> element defines a large heading

  • The <p> element defines a paragraph

Note: In the blank area of the web page, right-click and select "Web Page Source" or press F12Turn on debug mode, you can view the web page source code.

What is HTML?

HTML is a language used to describe web pages.

  • HTML stands for HyperText Markup Language

  • HTML is not a programming language, but a markup language

  • Markup language is a set of markup tags (markup tag)

  • HTML uses markup tags to describe web pages

  • HTML documents include HTML tags and text content

  • HTML documents are also called web pages

HTML tag

HTML markup tags are usually referred to as HTML tags (HTML tag).

  • HTML tags are keywords enclosed in angle brackets, such as <html>

  • HTML tags usually appear in pairs, such as <b> and </b>

  • The first tag in a tag pair is the start tag, and the second tag is the end tag

  • Start and end tags are also known as open tags and close tags

<Tag>content</Tag>

HTML Elements

"HTML tag" and "HTML element" usually mean the same thing.

But strictly speaking, an HTML element includes both a start tag and an end tag, as shown 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.

Browsers do not display HTML tags directly, but tags can be used to determine how to present the content of the HTML page to the user:


HTML Web Page Structure

Below is a visual HTML page structure:

<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a title</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>
Only the <body> area (the white part) will be displayed in the browser.

HTML Version

Since the birth of the internet, many HTML versions have emerged:

VersionPublishing time
HTML1991
HTML+1993
HTML 2.01995
HTML 3.21997
HTML 4.011999
XHTML 1.02000
HTML52012
XHTML52013

The !DOCTYPE declaration

The !DOCTYPE declaration is helpful for displaying web pages correctly in the browser.

There are many different files on the network, if the HTML version can be declared correctly, the browser can display the web page content correctly.

doctype Declaration is case-insensitive, the following methods are all acceptable:

<!DOCTYPE html> <!DOCTYPE HTML> <!doctype html> <!Doctype Html>

General Declaration

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 declaration typeDOCTYPE Reference Manual.

Chinese encoding

Currently, Chinese characters may appear garbled in most browsers when output directly, at this time we need to declare the character set as UTF in the header.-8 or GBK.

<!DOCTYPE　html>
<html>
<head>
<meta　http-equiv="Content-Type" content="text/html;charset=utf-8"　/>
<title>utf-8Encoding web page(oldtoolbag.com)</title>
</head>
<body>
　
<h1>My first utf-8Encoding web page title</h1>
　
<p>My First UTF-8Encoding Web Page Paragraphs.</p>
　
</body>
</html>
Test and See ‹/›

HTML Common EditorsHTML Basic Tutorial