一、html语法规范
开始标签结束标签 双标签 标签成对出现 单标签（极少）：换行 图像标签
标签关系：
二、基本标签结构
Html页面也叫html文档
基本结构标签（骨架标签）
文档类型声明标签 非html文档标签Lang 语言种类："en"定义语言为英语网页 "zh-CN"定义语言为中文网页
charset:字符集三、html标签上
1、标题标签，6个等级网页标题，即
-
我是一级标题
h为head缩写 作为标题标签 并根据重要性依次递减 一行显示2、段落标签
用于定义一个段落，可将网页分成不同的段落，段落之间有明显的分隔3、 换行标签
，是一个单标签，强制让文字换行 break
4、文本格式化标签:设置粗体，斜体，下划线等效果，用格式化标签，突出重要性
加粗标签：
倾斜标签：
删除线：
下划线：
5、盒子标签，没有语义，用来布局页面
分割、分区 跨度、跨距6、图像标签和路径
单标签，用于定义html页面中的图像，image
src是标签的必须属性（属于这个图像标签的特性），它用于指定图像文件的路径和文件名，属性值为图片路径
图像标签的其他属性：
A、属性值为文本：1、alt 替换文本，图像显示不出来时用文字代替;
2、title 提示文本，鼠标放到图像上时，提示的文字；
B、属性值为像素：1、width 设置图像宽度
2、height 设置图像高度
3、border 设置图像的边框粗细
注意：图像标签可有多个属性，跟在标签名img后面；
属性之间不分先后，标签名与属性、属性与属性之间用空格分开
属性采取键值对的格式，即key=“value”的格式，属性=“属性值”
路径：1、目录文件夹和根目录：目录文件夹就是最大的一个文件夹，根目录就是打开目录文件夹的第一层
2、页面中的图像非常多，建一个文件夹保存，引用图片有相对路径、绝对路径
相对路径：以引用文件所在位置为参考基础，而建立出的目录路径。简单来说就是图片相对于html页面的位置。
1、图像文件位于html同一级路径 
2、图像文件位于html下一级路径 / 
3、图像文件位于html上一级路径 …/ 
绝对路径：是指目录下的绝对位置，直接到达目标位置，通常是从盘符开始的路径；如：“D:\web\img\logo.gif"或完整的网络地址"http://www.itcast.cn/images/logo.gif”
7、超链接标签
标签用于定义超链接，作用是从一个页面跳到另一个页面
语法格式 文本或图像
href属性：必须属性，用于指定链接目标的url地址，为标签应用href属性时，它就具有了超链接的功能
target属性：打开窗口的方式 默认值是 _self当前窗口打开页面 _blank新窗口打开页面
链接分类：1、外部链接：访问外部网站，一定要加http://再加网址.如百度
2、内部链接：网站内部页面之间的相互链接，直接链接内部页面名称即可。如首页
3、空链接：# 未决定跳转到哪的链接
4、下载链接：地址链接的是文件 .exe或者是zip等压缩包形式，会下载这个文件 下载文件
5、网页元素的链接：在网页中的各种网页元素，如文本、图像、表格、音频、视频等都可以添加超链接。
6、锚点链接：点击链接，可以快速定位到该页面的某个位置，即当前页面的跳转。
在链接文本的href属性中，设置属性值为#名字的形式，如第2集
找到目标位置的标签，里面添加一个id属性=刚才的名字，如
第2集介绍
四、注释与特殊字符
1、注释标签
2、特殊字符
空格符： 
小于号：<
大于号：>
五、html标签下
1、表格标签
不是用来布局页面的，是用来展示数据的
基本语法：
| 单元格内的文字 |
表头单元格,单元格内文字加粗居中，突出重要性
| 单元格内的文字 |
|---|
表格属性，实际开发中不常用，后面通过css来设置，表格属性要写到表格标签table中去
align：对齐属性，规定表格相对周围元素的对齐方式，left、center、right
Border：表格边框，默认为无“”或“1”
Cellpadding：文字距离单元格边框的空白，像素值，默认为1像素
cellspacing：单元格和单元格的距离，像素值，默认2像素
width：表格宽
height：表格高
2、表格结构标签
为了更好的表示表格的语义，可以将表格分割成表格头部和表格主体；在表格标签中，用标签表示表格头部整个区域；和th标签不同，th仅是表头单元格，而thead是整个表头；标签表示表格主体区域;
thead和tbody标签都嵌套在table标签里
3、合并单元格
特殊情况下，可把多个单元格合并为一个单元格
合并单元格的方式：跨行合并：rowspan=“合并单元格的个数”
跨列合并：colspan=“合并单元格的个数”
目标单元格：写合并代码的位置；跨行：将上侧单元格视为目标；跨列：将左侧单元格视为目标
合并单元格的步骤：1、确定和跨行还是跨列合并；2、找到目标单元格，写上合并方式=合并的单元格数量。如：;3、删除多余的单元格。
4、列表标签
表格是显示数据的，列表是来布局的
列表最大的特点就是整齐、整洁、有序，它作为布局会更加自由和方便
列表分类：
无序列表：
- 标签定义
- 列表项1
- 列表项2
- 列表项3
…
⚠️：无序列表的各个列表项之间没有顺序级别之分，是并列的；
- 标签，直接在ul标签中输入其他标签或者文字的做法是不被允许的；
- 标签之间相当于一个容器，可以容纳所有元素，即什么标签，文字都可以嵌套；
无序列表会带有自己的样式属性，但在实际使用时，我们会使用css来设置；有序列表:
- 标签来定义列表项
- 列表项1
- 列表项2
- 列表项3
…
⚠️：有序列表即为有排列顺序的列表，其哥哥列表项会按照一定的顺序排列定义；
- 标签，直接在ol标签中输入其他标签或者文字的做法是不被允许的；
- 标签之间相当于一个容器，可以容纳所有元素，即什么标签，文字都可以嵌套；
有序列表会带有自己的样式属性，但在实际使用时，我们会使用css来设置；自定义列表:
- 名词1解释1
- 名词1解释2
- 名词1解释3
名词1
⚠️：
- ;
和
- 个数没有限制，经常是一个
对应多个- ;
和
- 可容纳所有元素，放任何标签
使用场景：自定义列表常用语对术语或名词进行解释和描述，定义列表的列表项前没有任何项目符号；5、表单标签
使用表单目的是为了收集用户信息
表单的组成，在html中，一个完整的表单通常由表单域，表单控件（表单元素）和提示信息3个部分构成表单域：是一个包含表单元素的区域，标签用于定义表单域，以实现用户信息的收集和传递；form会把它范围内的表单元素信息提交给服务器。
各种表单元素控件 常用属性：action，属性值为url地址，用于指定接受并处理表单数据的服务器程序的url地址；？服务器编程阶段 method：属性值为get/post，用于设置表单数据的提交方式，其取值为get或post； name：属性值为名称，用于指定表单的名称，以区分同一个页面中的多个表单域；表单控件（表单元素）：在表单域中可以定义各种表单元素，这些表单元素就是允许用户在表单中输入或选择的内容控件。
1、input输入表单元素：在表单元素中标签用于收集用户信息，在标签中，包含一个type属性，根据不同的type属性值，输入字段拥有很多形式（可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等）。
标签为单标签；type属性设置不同的属性值用来指定不同的控件类型；
type属性的属性值：button：定义可点击按钮（多数情况下，用于通过javascript启动脚本）；
checkbox：定义复选框；
file：定义输入字段和“浏览”按钮，供文件上传；
hidden：定义隐藏的输入字段；
image：定义图像形式的提交按钮；
password：定义密码字段，该字段中的字符被掩码；
radio：定义单选按钮；
reset：定义重置按钮，重置按钮会清除表单中的所有数据；
submit：定义提交按钮，提交按钮会把表单数据发送到服务器；
text：定义单行的输入字段，用户可在其中输入文本，默认宽度为20个字符；除type属性外，<input/>标签还有其他很多属性，其中常用的有： name：属性值由用户自定义，定义input元素的名称，区别不同表单元素； value：属性值由用户自定义，规定input元素的值； checked：属性值为checked，规定此input元素首次加载时应当被选中,主要针对单选按钮和复选框； Maxlength：属性值为正整数，规定输入字段中的字符的最大长度； ⚠️：name和value是每个表单元素都有的属性值，主要给后台人员使用； name表单元素的名字，要求单选按钮和复选框要有相同的name值；补充：标签为input元素定义标注标签，label标签用于绑定一个表单元素，党点击label标签内的文本时，浏览器就会自动将焦点（光标）转到或者选择对应的表单元素，用来增加用户体验。
<input type=“radio” name=“sex” id="sex />
此时单击男也可选中单选按钮。
⚠️：标签的for属性应当与相关元素的id属性相同2、select下拉表单元素:如果在页面中，有多个选项让用户选择，并且想要节约空间，就使用下拉列表。 <select> <option>选项1</option> <option>选项2</option> <option>选项3</option> <option>选项4</option> ... </select> ⚠️：select标签中至少包含一对option；在option中定义selected=“selected”时，当前项即为默认选中项。 3、textarea文本域元素:当用户输入内容较多的情况下，在表单元素中，<textarea></textarea>标签是用于定义多行文本输入的控件。使用该控件，可以输入更多的文字，常见于留言板，评论。 <textarea rows="3" cols="20"> 文本内容 </textarea> ⚠️：通过textarea标签可以轻松地创建多行文本输入；cols=“每行中的字符数” rows=“显示的行数”，在实际开发中不使用这两个属性，都是用css来改变大小。
2275
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
