目录
---
1.HTML语法规范
1.1 基本语法概述
1.HTML标签是由尖括号包围的关键词，例如<html>.
2.HTML标签通常是成对出现的，例如<html>和</html>，我们称为双标签，标签对中第一个标签是开始标签，第二个标签是结束标签。
3.有些特殊的标签必须是单个标签（极少情况），例如<br />，我们称为单标签。
1.2. 标签关系
双标签关系可以分为两类：包含关系和并列关系。
包含关系 (父子关系）
<head> <title> </title> <head>并列关系（兄弟关系）
<head> </head> <body> </body>
2.HTML基本结构标签
2.1 第一个HTML网页
每个网页都会有一个基本的结构标签（也称为骨架标签），网页内容也是在这些基本标签上书写的。
HTML页面也称为HTML文档。
<html>//————>html最大的标签，根标签
<head>//————>文档的头部
<title>我的第一个网页</title>//————>网页标题
</head>
<body>
web学习每一天！//————>文档的主体，以后我们的网页内容，基本都是放在body里面的
</body>
</html>| 标签名 | 定义 | 说明 |
| <html> </html> | HTML标签 | 页面中最大的标签，我们称为根标签 |
| <head> </head> | 文档的头部 | 注意在head标签中我们必须要设置的是title |
| <title> </title> | 文档的标题 | 让页面拥有一个属于自己的网页标题 |
| <body> </body> | 文档的主体 | 元素包含文档的所有内容，网页内容，基本都是放在body里面的 |
浏览器的作用是读取HTML文档，并以网页的形式显示它们；
3.其他标签
3.1 文档类型声明标签
<!DOCTYPE>文档类型声明，作用是告诉浏览器使用哪种HTML版本来显示页面。
<!DOCTYPE html>————>这句代码的意思是当前采取的是HTML5版本来显示网页。1.<!DOCTYPE>声明位于文档的最前面，处于<html>标签之前；
2.<!DOCTYPE>不是HTML标签，是文档类型声明标签。
3.2 lang语言种类
<html lang="..."> 用来定义当前文档显示的语言。
1.en表示英语；
2.zh-CN表示中文
en就是英文网页，zh-CN就是中文网页。但是en的文档也可以显示中文，zh-CN的文档也可以显示英文。
这个属性对于浏览器和搜索引擎还是有作用的。
3.3 字符集
字符集（Character set)是多个字符的集合，以便计算机能够识别和存储各种文字。
在<head>标签中，可以通过<meta>标签的charset属性来规定HTML文档应该使用哪种字符编码。
<meta charset="UTF-8">//————>UTF—8也被称为万国码，基本包含了全世界所有国家的字符，其他如GB2312表示简体中文，BIG5表示繁体中文，GBK表示简体和繁体中文。这句话如果不用会乱码，原理后续解释。
4.HTML常用标签
4.1 标签语义
1.学习时，重点记住标签的语义 。
2.根据标签的语义，在合适的地方给一个合理的标签，可以让页面结构更加清晰。如标题标签，段落标签。
4.2 标题标签 <h1>---<h6>
为了使网页更具语义化，我们经常会在页面中用到标题标签，HTML提供了6个等级的网页标签，即<h1>---<h6>。
<h1>我是一级标题</h1>单词head的缩写，意为头部，标题。
标题语义：作为标题使用，并且根据重要性递减。即一级比二级更重要。
特点：1.加了标题的文字会加粗，字号也更大。
2.标题独占一行。
4.3 段落和换行标签
<p>我是一个段落标签</p>调查paragraph的缩写，意为段落。<p>标签用于定义段落，可以将整个网页分为若干个段落。
<br /> 换行标签，单词break的缩写，意为强制换行。用回车是没有效果的。特点：1.<br />是单标签。
2.<br />只是简单地另起一行，跟段落不一样，段落之间会插入一些垂直的间距。
4.4 文本格式化标签
在页面中，有时需要设置粗体，斜体或下划线等效果，这时就需要用到HTML中的文本格式化标签，使这些字体以特殊的方式显示。
标签语义：突出重要性。
加粗：
我是<strong>加粗</strong>的文字
我是<b>加粗</b>的文字————>推荐<strong>，语义更加强烈倾斜：
我是<em>倾斜</em>的文字
我是<i>倾斜</i>的文字————>推荐<em>，语气更加强烈删除线：
我是<del>删除线：</del>
我是<s>删除线：</s>————>推荐<del>，语气更加强烈下划线：
我是<ins>下划线</ins>
我是<u>下划线</u>————>推荐<ins>,语义更强烈
4.5 <div>和<span>标签
<div>和<span>是没有语义的，它们就是一个盒子，是用来装内容的，可以装图片，文字。
都是双标签。
div是division的缩写，表示分区，span意为跨度，跨距。
特点：1.<div>一个人独占一行，是一个大盒子，用来布局。
2.<span>一行可以多个<span>，小盒子，用来布局。
4.6图像标签和路径
1.图像标签
在HTML标签中，<img>用于定义HTML页面中的图像。
<img src="图像URL"/>src是<img>标签的必须属性，它用于指定图像文件的路径和文件名。
所谓属性，简单理解就是属这个图像标签的特性。
图像标签的其他属性：
| 属性 | 属性值 | 说明 |
| src | 图片路径 | 必须属性 |
| alt | 文本 | 替换文本。图像不能显示时，显示的文字 |
| title | 文本 | 提示文本，只要鼠标放在图像上，显示的文字 |
| width | 像素 | 设置图像的宽度 |
| height | 像素 | 设置图像的高度 |
| border | 像素 | 设置图像的边框粗细 |
<img src="logo1.jpg" alt="web学习每一天"/> 
注意点：
1.属性要放在标签名后面2.属性之间没有先后顺序，属性与属性之间要有空格隔开
3.属性采取键值对的格式，即key=“value”，属性=属性值。
2.路径
-
目录文件夹和根目录:
实际工作中,我们的文件不能随便乱放,否则用起来很难快速的找到他们,因此我们需要一个文件夹来管理他们。 - 路径： 另一个博主笔记的传送门
4.7超链接标签
在HTML标签中，<a>标签用于定义超链接，作用是从一个页面链接到另一个页面。
超链接的语法规范
<a href=”跳转目标” target=”目标窗口的弹出方式”> 文本或图像 </a>点击文本或图像就可以跳转到另一个页面
a是anchor的缩写，意为“锚”。
| 属性 | 作用 |
| href | 用于指定链接目标的url地址，是必须属性，当为标签应用href属性时，它就具有了超链接功能。 |
| target | 用于指定链接页面的打开方式，其中_self为默认值（当前窗口打开页面），_blank为在新窗口中打开页面方式。 |
链接分类
1. 外部链接：例如<a href =”http://www.baidu.com”>百度</a> 去往外部的网站。
2. 内部链接：网站内部页面之间的相互链接，之间链接内容页面名称即可，例如<a href=”index.html”首页</a>。
3. 空链接：如果当时没有确定链接目标时，<a href="#">首页</a>。
4.下载链接：如果 href 里面地址是一个文件或者压缩包，会下载这个文件，如exe/zip。
5.网页元素链接：在网页中的各种网页元素，如文本，图像，表格，音频，视频等都可以添加超链接。例如<a href="http://www.baidu.com"><img src="logo.jpg"/></a>。
6. 锚点链接：点我们点击继续，可以快速到同一个页面的某个位置。
6.1 在链接文本的href属性中，设置属性值为#名字的形式，如<a href = "#two"> 第二集 </a>;
6.2 找到目标位置标签，里面添加一个id属性=刚才的名字，如<h3 id ="two">第二集介绍 </h3>。
4.8 HTML的注释标签和特殊字符
1.注释标签
HTML中的注释以 <!--"开头，以"-->"结束。快捷键：crtl + /。
2. 特殊字符
在HTML页面中，一些特殊的符号或者不方便直接使用，此时我们就可以使用下面的字符来替代。
| 特殊字符 | 描述 | 字符的代码 |
| 空格符 |   | |
| < | 小于号 | <； |
| > | 大于号 | >； |
| & | 和号 | &； |
| ￥ | 人民币 | ¥； |
| © | 版权 | ©； |
| 注册商标 | ®； | |
| 摄氏度 | °； | |
| ± | 正负号 | ±； |
| x | 乘号 | ×； |
| ÷ | 除号 | ÷； |
| ² | 平方2（上标2） | ²； |
| ³ | 立方3 | ³； |
扫一扫
4732
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
