Html 简明教程

HTML - Introduction

HTML 是一种超文本标记语言，用于创建网页或网站结构。它是 Web 开发中最常用的语言。

HTML is a HyperText markup language which is used to create the webpage or website structure. It is the mostly used language in web development.

HTML 用于创建网页，它具有许多元素，如：- * Headings* 、 * Paragraphs* 、 * Forms* 、 * Tables* 、 * Lists* 等。每个元素都有自己的用途，例如标题元素用于创建标题内容，段落元素用于创建文本段落内容，以此类推。

HTML is used to create the web pages, it has a lot of elements like - Headings, Paragraphs, Forms, Tables, Lists, etc. Each of them are used for their own purpose, like heading elements are used to create a header content, paragraph elements are used to create textual paragraph content and so on.

What is HTML?

HTML 或超文本标记语言是一种常见的标记语言，适用于面向 Web 浏览器的文档。它创建 Web 资料的结构和内容。一些技术常常帮助它们，例如 * Cascading Style Sheets (CSS)* 和脚本语言，如 * JavaScript* 。

HTML or HyperText Markup Language is common markup language for documents intended for web browser. It creates the structure and content of web material. Technologies like Cascading Style Sheets (CSS) and scripting languages like JavaScript frequently help with it.

Why use HTML?

HTML 是任何网站的结构基础，为了创建或开发任何网站，我们需要使用 HTML，例如提供一个标题部分，或者页脚部分，或者它可以是一个侧边部分或任何它可以做到的。一般而言，HTML 将创建结构，我们也可以使用 HTML 将其它元素放入该结构中。

HTML is the skull structure of any website, to create or develop any website we will need to use the HTML, like giving a header section or footer section or it can be a sidebar section anything it could be. Basically HTML will create the structure where we will put other elements by using HTML as well.

HTML Versions

html version release year

要进一步了解 HTML 随时间发展而来的演变历程，请查阅我们的 * HTML - History and Evolution.*

To know more about the HTML Evolution over the time period please check our HTML - History and Evolution.

HTML Document Structure

HTML 元素具有层次结构，这意味着我们可以在一个元素内创建元素。但有一些规则需要遵循，例如不能将头部放在正文之内，因此要了解 HTML 文档的基本结构，请查看以下示例代码。

HTML elements are hierarchical, meaning we can create elements inside of an element. But there are few rules to follow like the head can not be placed inside of a body like that so to know the basic structure of an HTML document please check the below example code.

在下面的代码中，您可以看到具有代码在右侧提供的输出的 HTML 文档的结构。

In the below code you can see the structure of the HTML document with the output that the code provided on the right side.

HTML Example Code

尝试单击图标 运行按钮来运行以下 HTML 代码以查看输出。

Try to click the icon run button to run the following HTML code to see the output.

<!-- HTML Version Declaration -->
<!DOCTYPE html>
<!-- HTML Root Element -->
<html>

<!-- HTML Head Section -->
<head>
    <!-- HTML Document Title -->
    <title>This is Title</title>
</head>

<!-- HTML Body Section -->
<body>
    <!-- HTML Header Element -->
    <h1>This is Header</h1>
    <!-- HTML Paragraphs Element -->
    <p>This is a Paragraph</div>
</body>
</html>

上述 HTML 文档示例使用了以下标签：

Above example of HTML document uses the following tags:

Tag

Description

<!DOCTYPE>

This tag defines the document type and HTML version.

<html>

This tag encloses the complete HTML document and mainly comprises of document header which is represented by <head>…​</head> and document body which is represented by <body>…​</body> tags.

<head>

This tag represents the document’s header which can keep other HTML tags like <title>, <link> etc.

<title>

The <title> tag is used inside the <head> tag to mention the document title.

<body>

This tag represents the document’s body which keeps other HTML tags like <h1>, <div>, <p> etc.

<h1> to <h6>

Specifies header h1 to header h6.

<p>

This tag represents a paragraph.

Role of Web Browsers in HTML

Google Chrome、Mozilla Firefox、Microsoft Edge、Apple Safari、Opera 等 Web 浏览器能够显示 HTML 代码的输出，它将基于标签和属性定义字体大小、粗细、结构等。

Web Browsers like Google Chrome, Mozilla Firefox, Microsoft Edge, Apple Safari, Opera, etc are able to show the output of HTML code, it will define the font size, weight, structure, etc based on tags and attributes.

HTML Tags, Attributes and Elements

HTML 标签和属性创建 HTML 元素，这些元素呈现在网页上。

HTML tags and attributes create the HTML elements which are rendered on the webpages.

  1. HTML Tags: Tags are similar to keywords, which specify how a web browser will format and display content. A web browser can differentiate between simple content and HTML content with the use of tags.

  2. HTML Attributes: Attributes are used to customize an element’s behavior, special terms called HTML attributes are utilized inside the opening tag. An HTML element type can be modified via HTML attributes.

  3. HTML Elements: Elements are building blocks of a web page. It consists of a start tag, an end tag, and the content between them.

Importance of Learning HTML

如果你想在 Web 开发中追求自己的职业生涯，学习 HTML 非常重要。它是发展的垫脚石。

It is important to learn HTML if you want to pursue your career in Web Development. It is the stepping stone for development.

少数需要 HTML 在任何网页上创建的一些示例。

A list of few things that required HTML to create on any webpages.

  1. Paragraph: The paragraph in the HTML document is used to express thoughts on the point in a clear way. In HTML the paragraph information is placed inside HTML - <p> Tag.

  2. Headings HTML Heading refers to the 6 levels through <h1> to <h6>, h1 being the most important heading level and h6 of lowest importance.

  3. Block Elements: Block elements are those who created a space just below of that element, and by default it renders on the left side unless we manipulate the direction by using any attribute of CSS property. Block elements are <div>, <p>, <table> and so on.

  4. Line Breaks: It is typically used to create separation between pieces of information or control the layout of content on a webpage for print media.

要学习HTML，您需要研究各种标签并了解它们的行为，同时格式化文本文档。学习HTML很简单，因为用户必须学习使用不同的标签来格式化文本或图像以制作漂亮的网页。

To learn HTML, you will need to study various tags and understand how they behave, while formatting a textual document. Learning HTML is simple as users have to learn the usage of different tags in order to format the text or images to make a beautiful webpage.