HTML 语法规范
基本语法概述
- HTML 标签是由尖括号包围的关键词，例如：
<html> - HTML 标签通常是成对出现，例如
<html>，</html>,我们称之为双标签。标签对中第一个标签是开始标签，后一个是结束标签。 - 有些特殊的标签是单个标签，例如
<br/>，我们称之为单标签。
标签关系
双标签可以分为两类：包含关系、并列关系
包含关系：例如
<head>
<title> </title>
</head>并列关系：例如
<head></head>
<body></body>HTML 基本结构标签
第一个 HTML 网页
每一个网页都会有一个骨架标签，称之为结构标签，是 HTML 文档必须包含的
<html>
<head>
<title>我的第一个页面</title>
</head>
<body>
Hello World!
</body>
</html>| 标签名 | 定义 | 说明 |
|---|---|---|
<html></html> | HTML 标签 | 页面中最大的标签，我们称之为 根标签 |
<head></head> | 文档的头部 | 必须包含<title></title>标签 |
<title></title> | 文档的标题 | 让页面拥有一个属于自己的网页标题 |
<body></body> | 文档的主体 | 元素包含文档的所有内容 |
网页开发基础标签
<!DOCTYPE>文档类型声明标签
<!DOCTYPE>文档类型声明标签，告诉浏览器用哪个版本的 HTML
注意：
<!DOCTYPE>必须写在整个 HTML 文档的最前面，处于<html>标签之前。<!DOCTYPE>不是一个HTML 标签，只是一个文档类型声明标签。
lang 语言种类
用来定义当前文档显示的语言
charset 字符集标签
字符集是多个字符的集合。
举例：
<mate charset="UTF-8">charset 的常用值有：GB2312、BIG5、 GBK、和 UTF-8，其中 UTF-8 也被称为万国码，基本包含了全世界所有国家要用到的字符。
HTML 常用标签
标签语义
根据语义来记标签是最好的。
标题标签 <h1>-<h6>
标签语义：作为标题使用，并且根据重要性逐级递减
特点：
- 加了标签的文字变粗变大。
- 一个标题独占一行。
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>伍级标题</h5>
<h6>六级标题</h6>段落和换行标签 <p>、<br />
标签语义：可以把 HTML 文档分成多段
特点：
- 文本在一个段落中会根据浏览器的窗口大小自动换行。
- 段落和段落之间留有空隙。
文本格式化标签
在网页中有时要将文字设置为 粗体、斜体、<u>下划线</u> 等效果，使文本以特殊的方式显示。
标签语义：突出重要性，比普通文字更重要。
| 语义 | 标签 | 说明 |
|---|---|---|
| 加粗 | <strong></strong> 或 <b></b> | 推荐 <strong></strong> |
| 倾斜 | <em></em> 或 <i></i> | 推荐 <em></em> |
| 删除线 | <del></del> 或 <s></s> | 推荐 <del></del> |
| 下划线 | <ins></ins> 或 <u></u> | 推荐 <ins></ins> |
<div> 和 <span> 标签
这两个标签没有其他实际意义，就是一个盒子，用来装内容。<div> 表示分割、分区<span> 表示跨度、跨距
特点：
<div>标签用来布局，一行只能放一个。<span>标签用来布局，一行能放多个。
图像标签和路径
图像标签
在 HTML 中，<img>标签用于定义 HTML 页面中的图像
举例：
<img src="URL" />图像标签的其他属性：
| 属性 | 属性值 | 说明 |
|---|---|---|
| src | 图片路径 | 必须属性，图片路径 |
| alt | 文本 | 替换文本，若图片无法显示，则替换为这个文本 |
| title | 文本 | 提示文本，鼠标放在图片上时显示 |
| width | 像素 | 设置图像宽度 |
| height | 像素 | 设置图像高度 |
| border | 像素 | 设置图像边框粗细 |
注意：
- src 是
<img>标签的必须属性，它用于指定图像文件的路径和文件名。 - 属性一定要写在标签名后面。
- 属性可以拥有多个，不分先后顺序。
- 属性采取键值对的格式，即 key = "value" 的格式，属性 = "属性值"。
路径
路径分为：相对路径 和 绝对路径
相对路径
定义：以 引用文件所在位置 为参考基础，而建立的目录路径。
| 相对路径分类 | 符号 | 说明 |
|---|---|---|
| 同一级路径 | 同一级目录 | |
| 下一级路径 | / | 下一级目录 |
| 上一级路径 | ../ | 上一级目录 |
绝对路径
定义：在计算机中的位置，通常从盘符开始，或完整的 URL 链接。
超链接标签
超链接的语法格式如下：
<a href = "跳转地址" target = "目标窗口的弹出方式">描述文本或图像</a>其中有两个属性：
| 属性 | 作用 |
|---|---|
| href | 指定跳转地址，必须包含 |
| target | _self 为默认值，在当前页打开；_blank 在新窗口打开 |
链接的分类：
- 外部链接，指链接到互联网上的某个网页。
- 内部链接，指链接到网站内部的某个网页。
- 空链接，指不指定网页的链接（相当于刷新当前页面）。
- 下载链接，指向某个压缩包或非网页格式的文件，用于下载该文件。
- 网页元素链接
锚点链接：
（1）在链接标签的 href 属性中，设置属性值为 #名字 的形式，如：<a href = "#two">第二集</a>
（2）找到目标位置标签，在链接标签属性中添加一个 id 属性 = #名字，如：
<h3 id = "two">第二集</h3> 本文由 小但 创作
全文共：3002个字
采用 知识共享署名4.0 国际许可协议进行许可
本站文章除注明转载，均为作者原创，转载前请务必署名
最后编辑时间为: Jul 5, 2020 at 03:08 pm