<p>HTML is the basic language for web page production. Its full name is "Hyper Text Markup Language", a computer language used to describe the structure and content of web pages. Learning to write HTML code is the first step in making a web page. Let’s introduce some basic HTML syntax and how to write code.
<ol><li>Build the basic structure
<p>The first line of HTML code should be the document type declaration, that is,
<!DOCTYPE html>
. This declaration tells the browser which document type definition (DTD) this document adopts. Followed by the
<html>
tag, used to indicate the beginning and end of the web page. Within the
<html>
tag, there are usually two important sub-tags:
<head>
and
<body>
.
<ul>
<li>
<head>
Tag: The content inside it will not be displayed directly in the browser, but is mainly used to provide metadata for the page. It can include
<title>
tags (used to set the title of the web page) and
<meta>
tags (used to set the keywords, description and other information of the web page), etc.
<li>
<body>
Tags: This is the main part of the page and contains the HTML tags for the web content.
<p>The following is a basic HTML structure code:
<!DOCTYPE html>
<html>
<head>
<title>我的网页标题</title>
<meta charset="utf-8">
</head>
<body>
这里是内容
</body>
</html>
Copy after login
<li>Text and title
<p>In HTML language, you can use a variety of tags to Defines different kinds of text, the most basic of which is the
<p>
tag, which represents a paragraph.
<p>这是一个段落。</p>
Copy after login
<p>In the above code, the text in the
<p>
tag "This is a paragraph." is the text content of a paragraph. At the same time, HTML also provides multiple levels of titles
(h1, h2, h3...h6)
to enhance the layering and structure of the article.
<h1>这是一个一级标题。</h1>
<h2>这是一个二级标题。</h2>
Copy after login
<li>Pictures
<p>Inserting pictures is a common operation in web design. In HTML language, you can use the
<img>
tag to insert images. .
<img src="图片路径" alt="图片描述">
Copy after login
<p>Among them, the
src
attribute is required and is used to specify the URL or relative file path of the image file. The
alt
attribute is used to display a text on the page to describe the content of the image when the image cannot be displayed.
<li>Link
<p>You can jump between web pages through links. In HTML, you can use the
<a>
tag to create a link. . The
<a href="http://www.example.com">这是一个链接</a>
Copy after login
<p>
href
attribute is required and is used to specify the target URL of the link. At the same time, you can also add the
title
attribute in the
<a>
tag to add prompt information when the mouse hovers.
<p>If you want to link to other HTML documents in the same directory, you can also use relative paths:
<a href="./about.html">关于我们</a>
Copy after login
<li>List
<p>In HTML, you can use
<ul>
and
<li>
tags to create an unordered list, use the
<ol>
and
<li>
tags to create an ordered list.
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ul>
<ol>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ol>
Copy after login
<li>Table
<p>In HTML, you can use
<table>
,
<tr>
,
<th>
and
<td>
tags to create a table.
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
</tr>
<tr>
<td>张三</td>
<td>18</td>
<td>男</td>
</tr>
<tr>
<td>李四</td>
<td>22</td>
<td>女</td>
</tr>
</table>
Copy after login
<p>Among them,
<th>
label represents the header cell,
<td>
label represents the data cell,
<tr># The ## label represents a row, and the
<table>
label represents the entire table.
Form<li>
Form is one of the common interaction methods in web design. In HTML, you can use <p>