HTML(HyperText Markup Language)是一种用于创建网页的标准标记语言,它通过一系列的标签来描述网页的结构和内容。本课程主要讲解了HTML中的各种标签及其用途,帮助学习者掌握网页制作的基础知识。
1. **基本结构标签**:
- `<html>`:HTML文档的根元素,包含整个网页的内容。
- `<head>`:定义文档头部信息,如标题、元数据等,不会在浏览器窗口中显示。
- `<title>`:设置文档的标题,显示在浏览器标签页上。
2. **文本格式化标签**:
- `<h1>` 至 `<h6>`:定义六级标题,`<h1>`是最大的标题,`<h6>`是最小的标题。
- `<pre>`:保留文本的空格和换行,用于展示预格式化的文本。
- `<u>`:添加下划线。
- `<b>`:设置黑体字。
- `<i>`:设置斜体字。
- `<tt>`:呈现打字机风格的字体。
- `<cite>`:表示引用,通常为斜体。
- `<em>`:强调文本,通常表现为斜体加粗。
- `<strong>`:加重文本,同样表现为斜体加粗。
- `<font>`:设置字体大小、颜色,但现代HTML更推荐使用CSS来控制样式。
- `<basefont>`:设定文档的基准字体。
- `<big>`:增大字体。
- `<small>`:减小字体。
- `<strike>`:添加删除线。
- `<code>`:表示代码块。
- `<kbd>`:表示键盘输入。
- `<samp>`:展示示例文本。
- `<var>`:表示变量。
- `<sub>`:下标字。
- `<sup>`:上标字。
- `<xmp>`:固定宽度字体,保留空白和换行。
- `<plaintext>`:固定宽度字体,不执行任何标记符号。
- `<listing>`:类似`<pre>`,但不保留换行。
3. **段落与换行标签**:
- `<p>`:创建一个段落。
- `<br>`:插入一个换行符。
- `<blockquote>`:用于引用或缩进文本。
- `<p align="">`:设置段落的对齐方式,可选左、中、右。
4. **列表标签**:
- `<dl>`:定义一个定义列表。
- `<dt>`:定义列表中的术语。
- `<dd>`:定义术语的解释。
- `<ol>`:创建有序列表,每个项目前有数字。
- `<ul>`:创建无序列表,每个项目前有圆点。
- `<li>`:定义列表项。
5. **区块与布局标签**:
- `<div>`:用于组织大块HTML内容,常用于布局。
- `<menu>`:创建选项清单。
- `<dir>`:创建目录清单。
- `<nobr>`:阻止文本换行。
- `<hr>`:绘制水平线,可以设置宽度和颜色。
- `<center>`:使内容水平居中。
6. **链接标签**:
- `<a>`:创建超链接,`href`属性指定链接地址。
- `mailto:`:创建邮件链接。
- `name`属性:创建内部书签,便于页面内跳转。
- `target`属性:定义链接在何处打开,如`_blank`(新窗口)、`_self`(当前窗口)等。
- `rel`和`rev`属性:定义链接关系。
- `accesskey`属性:设置元素的快捷键。
- `shape`和`coords`属性:在图像映射中定义链接区域形状和坐标。
7. **表格标签**:
- `<table>`:创建表格。
- `<tr>`:定义表格行。
- `<td>`:定义表格单元格。
- `<th>`:定义表头单元格,通常居中加粗。
- `cellspacing`属性:设置单元格之间的间距。
- `cellpadding`属性:设置单元格内容与边框之间的距离。
这些标签是HTML的基础,通过它们的组合使用,可以构建出复杂的网页结构和样式。了解并熟练掌握这些标签,对于网页设计和开发至关重要。在实际应用中,还需要结合CSS和JavaScript等技术,以实现更丰富的交互和视觉效果。