1 什么是HTML
HTML 是用来描述网页的一种语言。HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本，添加图片，创建链接、输入表单、框架和表格等等，并可将之存为文本文件，浏览器即可读取和显示。
- HTML 指的是超文本标记语言: HyperText Markup Language
- HTML 不是一种编程语言，而是一种标记语言
- 标记语言是一套标记标签 (markup tag)
- HTML 使用标记标签来描述网页
- HTML 文档包含了HTML 标签及文本内容
- HTML文档也叫做 web 页面
2 入门实例
新建一个test.html文件，内容如下
ZONGXP 我的第一个标题
我的第一个段落。
其中：
- 声明为 HTML5 文档
- 元素是 HTML 页面的根元素
- 元素包含了文档的元（meta）数据，如 定义网页编码格式为 utf-8（由于在大部分浏览器中直接输出中文会出现乱码，所以要在头部将字符声明为UTF-8）
</span></span></strong><span style='font-size: 15px;'><span style='color: #555963; --tt-darkmode-color: #555963;' class='data-color--tt-darkmode-555963'> 元素描述了文档的标题</span></span></li><li style='margin: 8px 0px 0px;'><strong><span style='font-size: 15px;'><span style='color: #555963; --tt-darkmode-color: #555963;' class='data-color--tt-darkmode-555963'><body></span></span></strong><span style='font-size: 15px;'><span style='color: #555963; --tt-darkmode-color: #555963;' class='data-color--tt-darkmode-555963'> 元素包含了可见的页面内容</span></span></li><li style='margin: 8px 0px 0px;'><strong><span style='font-size: 15px;'><span style='color: #555963; --tt-darkmode-color: #555963;' class='data-color--tt-darkmode-555963'><h1></span></span></strong><span style='font-size: 15px;'><span style='color: #555963; --tt-darkmode-color: #555963;' class='data-color--tt-darkmode-555963'> 元素定义一个大标题</span></span></li><li style='margin: 8px 0px 0px;'><strong><span style='font-size: 15px;'><span style='color: #555963; --tt-darkmode-color: #555963;' class='data-color--tt-darkmode-555963'><p></span></span></strong><span style='font-size: 15px;'><span style='color: #555963; --tt-darkmode-color: #555963;' class='data-color--tt-darkmode-555963'> 元素定义一个段落</span></span></li></ul><p style='margin: 8px 0px 0px;' data-track='20'><span style='color: #222226; --tt-darkmode-color: #BEBEC5;' class='data-color--tt-darkmode-bebec5'>保存后运行，即可在浏览器中打开如下界面</span></p><div class='pgc-img'><p class='pgc-img-caption'></p></div><h1 class='pgc-h-arrow-right'>3 各部分详解</h1><p data-track='22'><span style='font-size: 19px;'>3.1 标题</span></p><p style='margin: 8px 0px 0px;' data-track='23'><span style='color: #222226; --tt-darkmode-color: #BEBEC5;' class='data-color--tt-darkmode-bebec5'>HTML 标题（Heading）是通过<h1> - <h6> 标签来定义的.</span></p><pre class="prism-highlight prism-language-bash" class='syl-page-code'><code><!doctype html><html><head><meta><title>ZONGXP 这是标题 1
这是标题 2
这是标题 3
这是标题 4
这是标题 5
这是标题 6
3.2 段落
HTML 段落是通过标签
来定义的
ZONGXP 这是一个段落。
这是一个段落。
这是一个段落。
3.3 链接
HTML 链接是通过标签 来定义的
ZONGXP 这是一个链接使用了 href 属性3.4 图像
HTML 图像是通过标签
来定义的。注意： 图像的名称和尺寸是以属性的形式提供的。
ZONGXP 3.5 表格
表格由
标签来定义。每个表格均有若干行（由
标签定义），每行被分割为若干单元格（由 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。表格的表头使用 标签进行定义。如果不定义边框属性，表格将不显示边框。有时这很有用，但是大多数时候，我们希望显示边框。使用边框属性来显示一个带有边框的表格： Header 1 Header 2 row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2 4 速查列表
4.1 基本文档
文档标题 可见文本...4.2 基本标签
最大的标题
. . .
. . .
. . .
. . .
最小的标题
这是一个段落。
（换行）
（水平线）4.3 文本格式化
粗体文本计算机代码强调文本斜体文本键盘输入预格式化文本
更小的文本重要的文本 （缩写） （联系信息） （文字方向）（从另一个源引用的部分） （工作的名称）
（删除的文本） （插入的文本） （下标文本） （上标文本）4.4 链接
普通的链接：链接文本图像链接： 邮件链接： 发送e-mail书签：提示部分跳到提示部分4.5 图片
4.6 样式/区块
文档中的块级元素文档中的内联元素4.7 无序列表
- 项目
- 项目
4.8 有序列表
猜你喜欢
- 2025-03-18 快速了解JavaScript富文本编辑（js 富文本编辑器 开源）
- 2025-03-18 我是这样给500万迅雷会员做活动的
- 2025-03-18 什么是Markdown，如何使用它?（markdown使用教程）
- 2025-03-18 你可能不知道的10个CSS3中的隐藏特性
- 2025-03-18 第二章:基础概念精讲 - 第四节 - Tailwind CSS 排版和文本样式
- 2025-03-18 微信公众号文章如何在线编辑?（微信公众号文章如何在线编辑出来）
- 2025-03-18 发现 Rich:让 Python 控制台应用炫酷起来的终极武器
- 2025-03-18 学前端怎能不知css系列-css初识（前端css要学多久）
- 2025-03-18 10招搞定web设计风格指南（web 设计模式）
- 2025-03-18 iOS 9 字体的介绍与使用（ios字体功能怎么用）
- 最近发表
- 标签列表
-
- newcoder (56)
- 字符串的长度是指 (45)
- drawcontours()参数说明 (60)
- unsignedshortint (59)
- postman并发请求 (47)
- python列表删除 (50)
- 左程云什么水平 (56)
- 计算机网络的拓扑结构是指() (45)
- 稳压管的稳压区是工作在什么区 (45)
- 编程题 (64)
- postgresql默认端口 (66)
- 数据库的概念模型独立于 (48)
- 产生系统死锁的原因可能是由于 (51)
- 数据库中只存放视图的 (62)
- 在vi中退出不保存的命令是 (53)
- 哪个命令可以将普通用户转换成超级用户 (49)
- noscript标签的作用 (48)
- 联合利华网申 (49)
- swagger和postman (46)
- 结构化程序设计主要强调 (53)
- 172.1 (57)
- apipostwebsocket (47)
- 唯品会后台 (61)
- 简历助手 (56)
- offshow (61)