第二节课知识梳理

h1~h6标签，由大变小，显示样式是粗体，越往下粗体效果越小

水平线标签 hr：出现一条水平线

段落标签p ：p标签里可以包裹文字等

br 换行标签 ：下一行，换行

img图片标签：会在页面显示图片

src：图片的路径，可以是绝对路径或者是相对路径

alt（文本）：图片不能显示时，替换出的文本

title（文本）：鼠标悬停时显示的内容

width：设置图像显示的宽度

height：设置图像显示的高度

a标签，链接标签：环绕需要被链接的对象

href：用于指定链接目标的url地址或链接。

当a标签应用了href属性时，它也就具备了超链接的功能，如果没有确定链接目标，通常a标签的href属性定义为#，表示该链接暂时为一个空连接。（点击后回到顶部）

target：用于指定链接页面打开的方式：

_blank：点击链接后打开一个新页面

_self：默认值，打开的页面会显示在原页面中

title：鼠标悬停时显示的内容

文本，图像，表格，音频，视频，都可以添加超链接

锚点链接：#：在被跳转的标签添加id，在跳转的标签添加href=“#id”，点击跳转标签就可以跳转到添加id的标签。

注释标签（ctrl+/）:便于阅读和理解，但并不显示在页面中的解释文本。

文件的相对路径与绝对路径（../：上一级）

绝对路径:不会因为自身的变化而变化。

绝对路径以web站点根目录为参考基础的目录路径。意指当所有网页引用同一个文件时，所使用的路径都是一样的。

相对路径:会根据当前你的位置变化而变化。

以引用文件之网页所在位置为参考基础，而建立出的目录路径。当保存于不同目录的网页引用同一个文件时，所使用的路径将不再相同，故称为相对路径。

/开头：表示根目录；./开头:代表当前所在的目录; ../开头:代表上一层目录。

列表

ul、li无序列表:无序列表是没有顺序的，ul只能嵌套li，但li可以容纳所有元素，无序列表列表项默认添加实心圆。

ol、li有序列表：有序列表就是有排列顺序的列表，有序列表列表项默认添加数字。

dl、dt、dd自定义列表（自定义块级标签）：自定义列表常用于对术语或名词进行解释和描述，定义列表的列表项前没有任何符号。

(电商网站首页中对于产品的展现使用较多)

dt类似于标题

dd是内容

start=“”（从几开始）

reversed：倒叙

表格的制作

（在早期表格布局使用的十分频繁）

表格结构：划分为标题，头部，主题和脚注。

caption：用于定义表格标题。

thead：用于定义表格的头部。一般包含列名，行号等表头信息。

tbody：用于定义表格的主题。一般包含数据内容。

tfoot：用于定义表格的脚注。

定义行和列的标签：

tr：用于定义表格的一行。

td：用于定义表格的单元格。

th：用于定义表头单元格。

表格属性：

border：设置表格的边框。

cellspacing：设置单元格与单元格边框之间的空白间距。

cellspadding：设置单元格内容与单元格边框之间的空白间距。

width：设置表格的宽度。

heigh：设置表格的高度。

align：设置表格在网页中的水平对齐方式。

合并单元格：

跨行合并：rowspan

（行合并）合并的顺序：从上到下

跨列合并：colspan

（列合并）合并的顺序：从左向右

表单及表单元素

表单控件（元素）：包含了具体的表单功能项，如文本输入框，密码输入框，复选框，提交按钮，重置按钮等。

提示信息：一个表单中通常还需要包含一些说明性的文字，提示用户进行填写和操作。

表单域：相当于一个容器，用来容纳所有的表单控件和提示信息，可以通过他定义处理表单数据所有程序的url地址，以及数据提交到服务器的方法。

input标签

input标签为单标签，是最常用的表单控件之一。

type属性是最基本的属性，其取值很多，用于指定不同的控件类型。

type：属性

属性值：

text：文本输入框

password：密码输入框

number：数字输入框

datetime：日期时间输入框

tel：电话号码输入框

emall：电子邮箱地址输入框

radio：单选按钮

checkbox：复选框

search：搜索框

button：普通按钮

submit：提交按钮

reset：重置按钮

file：文件域（文件上传）

hidden：隐藏域

下拉列表：select—>option

————————————————————

name：标签名称，表单域内唯一

value：标签的默认值

maxlength：允许输入的最大字符数

checked：选择标签默认被选中的项。

readonly：输入字段是只读的

disabled：禁用元素

placeholder:输入前的提示信息

action

当form表单提交之后，把表单内的数据，提交到哪个程序去做处理。（牵扯到前后端）

一般在开发过程中，我们会有一个前后端的开发文档，同样也有一个接口文档。后端人员开发的接口中需要拿到表单数据。

后端人员都是通过表单中的name属性值的去拿数据的。

前端开发人员，会根据要求，name属性的值，根据文档中命名规范标准去实施。

前端人员要根据文档中命名规范标准去实施。

——————————————————————

单选按钮的时候，name属性的值一定要是一样的，否则失去了单选按钮的效果。

如果我们牵扯到了文件上传，那我们要在form表单中设置一个属性：enctype=“multipart/form-data”