本文介绍了HTML的基础知识，包括HTML简介、浏览器的作用以及Web标准的重要性。深入讲解了HTML标签，如语法规范、基本结构、标题、段落、换行、文本格式化、div和span、图像、超链接、注释、特殊字符、表格、列表和表单的使用。通过学习，读者可以掌握HTML5的基本用法。
一、HTML基础导读
1.1 HTML简介
- 网页：通常是HTML文件格式，通过浏览器来阅读，常常由图片、文字、链接、视频、音频等元素构成。
- HTML：超文本标记语言（并非编程语言，超越文本、超级链接文本），用来描述网页的一种语言。
- 网页是由网页元素组成，这些元素是利用html标签描述，浏览器解析显示给用户的。
1.2 浏览器
- 常用浏览器：chrome，edge，firefox等
- 浏览器内核（渲染引擎）：负责读取网页内容，整理讯息，计算网页的显示方式并显示页面。
1.3 web标准
- web标准由W3C组织和其他标准化组织的指定的一系列标准的集合。
- web标准构成
- 结构
- 表现
- 行为
| 标准 | 说明 |
|---|---|
| 结构 | 对网页元素进行整理和分类（html） |
| 表现 | 设置网页元素的版式、颜色、大小等外观样式（css） |
| 行为 | 网页模型的定义与交互的编写（js） |
web标准最佳体验方案：结构、样式、行为分离。
二、HTML标签
2.1 HTML语法规范
- HTML标签：<>
- 双标签：<html>和</html>，第一个为开始标签，第二个为结束标签。（有包含关系和并列关系）
- 单标签：<br/>
2.2 HTML基本结构标签
- html：html最大标签，根标签
- head：文档的头部
- title：文档的标题
- body：文档的主体
- <!DOCTYPE html>：文档类型声明标签
- <html lang=“en”>：定义文档显示语言
- <meta charset=“UTF-8”>：字符集，以便计算机能够识别和存储各种文字。UTF-8为万国码。
2.3 HTML常用标签
2.3.1 标签语义
简而言之，标签的含义，可以使得页面结构更清晰。
2.3.2 标题标签
<h1>——<h6>：字号依次变小，每个标题独占一行
2.3.3 段落和换行标签
- 段落标签：p
- 换行标签：br /
2.3.4 文本格式化标签
| 语义 | 标签 | 说明 |
|---|---|---|
| 加粗 | strong或b | 更推荐strong |
| 倾斜 | em或i | 更推荐em |
| 删除线 | del或s | 更推荐del |
| 下划线 | ins或u | 更推荐ins |
2.3.5 div和span标签
它们没有语义，就是一个盒子，用来装内容，布局网页。
- div：独占一行
- span：一行可以有多个span标签
2.3.6 图像标签和路径
图像标签：<img src="url"/>
| 属性 | 属性值 | 说明 |
|---|---|---|
| src | 图片路径 | 必须属性 |
| alt | 文本 | 替换文本，图像不能显示时文本 |
| title | 文本 | 提示文本，鼠标放置到图像上时显示的文本 |
| width | 像素 | 设置图像的宽度 |
| height | 像素 | 设置图像的高度 |
| border | 像素 | 设置图像的边框粗细 |
路径
- 相对路径：以引用文件所在位置为参考，即图片相对于HTML文件所在位置。
| 相对路径分类 | 符号 |
|---|---|
| 同一级 | |
| 下一级 | / |
| 上一级 | …/ |
- 绝对路径：指文件的绝对地址。
2.3.7 超链接标签
- <a>标签用于定义超链接，作用是从一个页面链接到另一个页面。
<a herf="跳转目标" target="目标窗口弹出方式">文本或图像</a>
| 属性 | 作用 |
|---|---|
| href | 指定链接目标的url地址（必须属性），当标签应用href属性时， |
最低0.47元/天 解锁文章
扫一扫
593
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
