1、图像与链接 1、链接-锚点 1、什么是锚点 用于在页面中做一个记号，允许页面随时随地的跳转到这个记号的位置处 2、使用方式 1、定义锚点(做记号) 1、使用 a 标记的 name 属性 <a name="NO1">衣装鞋帽</a> 2、使用任何一个标记的 id 属性 <ANY id="锚点名称"></ANY> 2、链接到锚点上(跳到记号位置处) <a href="#锚点名称">内容</a> ex: <a href="#NO1">...</a> 以上方式，链接到本页的锚点处
链接到其他页面的锚点处: <a href="页面url#锚点名称"></a> 2、表格 1、什么是表格&表格作用 由一些 被称之为 单元格的矩形框 按照从左到右从上到下的顺序排列到一起组成的 表格的作用 以一定的结构来显示信息的。 2、使用表格 1、创建表格(语法) 表格：表格，行，列(单元格)组成 定义表格：<table></table> 创建表行：<tr></tr> 创建列(单元格):<td></td>
注意：默认情况下，每行中的列数是统一的。
table : display:table; 特点： 1、独占一行 2、宽度自适应(由内容来决定)
练习：创建一个三行四列的表格 2、表格属性 1、<table> 属性 1、width 设置表格宽度 2、height 设置表格高度 3、align 设置 表格 在其 父元素中的水平对齐方式，取值：left,center,right 4、border 边框,边框宽度，以px为单位的数值，px可以省略 5、cellpadding 单元格内边距 单元格边框与内容之间的距离 6、cellspacing 单元格外边距 单元格与单元格之间或者单元格与表格之间的 距离 7、bgcolor 背景颜色 2、<tr> 属性 1、align 该行的内容 水平对齐方式 2、valign 该行的内容 垂直对齐方式 取值：top，middle，bottom 3、bgcolor 3、<td> 属性 1、width 2、height 3、align 4、valign 5、bgcolor 6、colspan 设置单元格跨列 7、rowspan 设置单元格跨行 3、表格中的其他标记 1、<caption></caption> 作用：为表格定义标题 位置：表格正上方居中显示 <table> <caption>标题</caption> <tr> <td></td> <td></td> </tr> </table> 2、行标题或列标题 列标题：第一行中的每一列，加粗，水平居中的效果显示 行标题：每行里面的第一列, 加粗，水平居中的效果显示 行(列)标题:<th></th> <th></th>作用 与 <td></td>一模一样 3、表格的复杂应用 1、行分组 表格可以被划分成3个部分 1、表头 <thead></thead> 2、表主体 <tbody></tbody> 3、表尾 <tfoot></tfoot>
<table> <tbody> <tr></tr> <tr></tr> </tbody> </table>
注意：如果不对表格行进行分组的话，那么默认都属于 tbody 中 2、不规则表格 每行中的列数，不是统一化的。 1、跨列 合并列，让指定的单元格，横向向右，合并几个单元格(包含自己) 语法： td 的 colspan 属性 2、跨行 合并行，让指定的单元格，纵向向下，合并几个单元格(包含自己) 语法： td 的 rowspan 属性
注意：无论是跨行还是跨列，被合并的单元格一定从代码中删除出去 3、表格的嵌套 在一个表格中，又嵌入了另外一个表格 被嵌套的表格必须出现在<td>中 <table> <tr> <td> <table> <tr> <td> </td> </tr> </table> </td> </tr> </table> 3、列表 1、什么是列表&作用 将具有相似特征或先后顺序的内容按照从上到下的顺序排列起来 2、列表的组成 列表是由 列表类型 和 列表项 组成的 列表类型： 有序列表 无序列表 列表项： 表示具体的列表中的内容 3、使用列表 1、有序列表 1、语法: <ol></ol> --> Order List
列表项：<li>内容</li> --> List Item
练习：创建一个有序列表，存放四个人的姓名 2、ol 的属性 1、type 列表标识的类型 取值： 1、1 ：数字(默认值) 2、a ：小写字母 3、A ：大写字母 4、i ：小写罗马字符 5、I ：大写罗马字符 2、start 列表标识的起始编号 默认为1 2、无序列表 1、语法 <ul></ul>->Unorder List 列表项：<li></li> 2、属性 1、type 取值： 1、disc,实心圆(默认值) 2、circle,空心圆 3、square,实心矩形 4、none,不显示标识 4、列表嵌套 注意：显示的内容只能放在 li 中 <ul> <li>孙悟空</li> </ul> 5、定义列表 1、作用 用于要给出一类事物的定义的情形。 2、语法 1、<dl></dl> 定义一个定义列表 2、<dt></dt> 定义 列表中的一个术语 3、<dd></dd> 对 术语 进行解释和说明 3、使用场合 图文混排 4、结构标记 1、什么是结构标记 H5中新标记，用来表示页面布局的，从而提升标签的语义性 2、结构标记分类 1、<header></header> 作用：用于定义文档的头部 注意：允许在页面中出现多次，作为任何部分的头部信息定义 替代:<div id="header"></div> 2、<nav></nav> 作用：用于定义页面的导航链接部分 替代：<div id="nav"></div> 3、<section></section> 作用：用于定义文档中的具体组成部分，表示主体内容分 替代：<div id="main"></div> 4、<article></article> 作用：用于定义独立于文档主体内容的一些其他内容 比如：论坛中的帖子、新闻信息、博客或微博中的条目 5、<footer></footer> 作用：用于定义网页中的页脚信息，网页中的靠下部分的内容 6、<aside></aside> 作用：用于定义页面中的 边栏信息 注意：能使用 结构标记的 地方，尽量使用结构标记，无法被结构标记所取代的，就使用 <div id=""> 一起来实现布局 5、表单(重难点) 1、表单的作用 表单用于显示、收集信息，并将信息提交给服务器 2、完整的表单组成 1、表单 - form 2、表单控件 3、表单元素(重点) 1、语法 <form> 允许出现表单控件 </form> 2、属性 1、action 定义表单被提交时发生的动作 提交给服务器处理程序的地址 注意：通过 与服务器端人员交流 得到 action 的地址 默认，提交给本页 2、method 作用：定义表单提交数据时的方式 取值： 1、get (默认值) 意义为：得到，获取 场合：向服务器要数据时使用 特点： 1、明文提交,所提交的数据时可以显示在地址栏上的-安全性较低 2、提交数据有大小限制-最大为2KB 2、post 意义：邮寄，邮递 场合：将数据提交给服务器处理时使用(有保密类型数据时) 特点： 1、隐式提交-所提交的内容是不会显示在地址栏上的，安全性较高 2、无大小限制 3、put 4、delete 5、... 3、enctype 作用：编码类型，即表单数据进行编码的方式 允许表单将什么样的数据提交给服务器 取值： 1、application/x-www-form-urlencoded 默认值 允许将 普通字符，特殊字符，都提交给服务器，不允许提交 文件 2、multipart/form-data 允许 将文件 提交给服务器 3、text/plain 只允许提交普通字符。特殊字符，文件等都无法提交 4、name 定义 表单的名称
