1. 结构标签
<html>
:这是HTML文档的根元素,所有其他HTML元素都应该位于<html>
元素内部。<head>
:包含了文档的元数据,如文档的标题、字符集定义、样式链接、脚本链接等。这些信息不会直接显示在网页上,但对网页的渲染和行为至关重要。<title>
:定义了文档的标题,这个标题会显示在浏览器的标题栏或页面的标签上。<body>
:包含了可见的页面内容,如文本、图片、链接、表格、列表和表单等。
html
<!DOCTYPE html>
<html>
<head>
<title>你好</title>
<meta charset="UTF-8">
</head>
<body>
</body>
</html>
2. 文本格式化标签
- 标题标签 :
<h1>
至<h6>
,用于定义标题,<h1>
是最高级别的标题,<h6>
是最低级别的标题。标题标签默认会以粗体显示,并且大小依次递减。 - 段落标签 :
<p>
,用于定义段落。浏览器会自动在段落前后添加空行。 - 换行标签 :
<br>
,用于插入一个简单的换行符,而不是一个段落。 - 加粗标签 :
<strong>
和<b>
,都用于加粗文本,但<strong>
表示重要性更高的文本。 - 斜体标签 :
<em>
和<i>
,都用于将文本显示为斜体,但<em>
表示强调的文本。 - 删除线标签 :
<del>
和<s>
,都用于在文本上添加删除线,但<del>
表示不再准确或不再相关的内容。 - 下划线标签 :
<u>
,用于为文本添加下划线,但通常不推荐仅用于装饰目的,因为它可能会与链接混淆。
html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>创建不同字体大小的标题</h1>
<h2>创建不同字体大小的标题</h2>
<h3>创建不同字体大小的标题</h3>
<h4>创建不同字体大小的标题</h4>
<h5>创建不同字体大小的标题</h5>
<h6>创建不同字体大小的标题</h6>
<p>123</p>
<br>
<strong>1244</<strong>
<b>123</b>
<em>2</em>
<i>2</i>
<del>2</del>
<u>1</u>
</body>
</html>
3. 链接和图片标签
超链接标签 :<a>
,用于定义超链接,可以链接到另一个页面、图片、文件、电子邮件地址或同一页面内的某个位置。它有一个href
属性,用于指定链接的目标地址。
html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<img src="https://www.educoder.net/attachments/download/207801" alt="小狗"/>
</body>
</html>
4. 列表标签
- 无序列表 :
<ul>
,用于创建无序列表,列表项使用<li>
标签定义。 - 有序列表 :
<ol>
,用于创建有序列表,列表项同样使用<li>
标签定义。有序列表的列表项会自动编号。
5. 表格标签
- 表格标签 :
<table>
,用于定义表格。 - 表格行标签 :
<tr>
,定义表格中的一行。 - 表头单元格标签 :
<th>
,定义表格的表头单元格,通常用于列标题,并会自动加粗和居中显示。 - 数据单元格标签 :
<td>
,定义表格的标准单元格,用于存放数据。
6. 表单标签
- 表单标签 :
<form>
,用于创建表单,以收集用户输入。表单可以包含输入字段、复选框、单选按钮、提交按钮等。 - 输入标签 :
<input>
,是表单中最常用的标签之一,根据type
属性的不同,可以表示文本框、
7. 其他常用标签
- 密码框、提交按钮等多种类型的输入控件。
<div>
:用于定义文档中的分区或节,是一个块级元素,常用于布局和样式化。<span>
:用于定义文档中的行内元素,通常用于对小块文本进行样式化。<hr>
:表示一条水平线,用于分隔内容。