1.表格

语法：

  1.<table></table> ：表示一个表格

  2.<tr></tr> ：表示表格中的一行

  3.<td></td> ：表行中的一列（单元格）

    <th></th> ：行 / 列 标题（加粗，水平居中）

  4.<caption></caption> ：表格的标题  该元素必须添加在 <table> 之下，所有的 <tr> 之上

  5.<col> ：按顺序设置表格每列宽度  该元素必须添加在 <table> 之下，所有的 <tr> 之上  属性：width 

  6.<colgroup> ：设置表格列分组的样式  属性：span（表示列数）  width

属性：

  1. table

    width 

    height

    align  设置表格的对齐方式   left / center / right

    border  边框宽度  单位：px

    bgcolor  背景颜色

    cellspacing  单元格外边距（单元格与单元格或单元格与表格之间的距离）

    cellpadding  单元格内边距（单元格与内容之间的距离）

  2. tr

    align  水平对齐

    valign  垂直对齐   top / middle / bottom

    bgcolor

  3. td / th

    align

    valign

    width

    height

    colspan  跨行

    rowspan  跨列

表格的复杂分组   （允许将若干行划分到一个组中，以便管理）

  1.表头行分组

    允许将行的内容单独分到表头行分组中  <thead></thead>

  2.表尾行分组

    允许将最后一行的内容单独分到表尾行分组中  <tfoot></tfoot>

  3.表主体行分组

    <tbody></tbody>

不规则表格创建（通过 td 的跨行和跨列来实现不规则的表格）

  1.跨行  <td colspan=" ">

    从指定单元格位置处开始，横着向右，合并掉几个单元格（包括自己），被合并掉的单元格要删除

  2.跨列  <td rowspan=" ">

    从指定单元格位置处开始，竖着向下，合并掉几个单元格（包括自己），被合并掉的单元格要删除

2.列表

有序列表   <ol></ol>

  列表项  <li></li>

无序列表  <ul></ul>

  列表项  <li></li> 

属性

  1.ol

    type

      1  ：按数字方式排列，默认值

      a  ：按小写英文方式排列

      A  ：按大写英文方式排列

      i  ：按小写罗马数字排列

      I  ：按大写罗马数字排列

    start  指定标识从几开始

  2.ul

    type

      disc  实心圆，默认值

      circle  空心圆

      square  实心矩形

      none  无标记

定义列表

  1.作用：以一种特殊的结构来排列数据，通常用于对一类事物 / 名词的解释

  2.语法：

    <dl></dl>

      <dt></dt>  声明要解释的事物名称或名词

      <dd></dd>  对上述名词或事物解释的内容

  3.常用场合  ：图文混排

3.表单

表单元素  <form></form> (只有放在<form></form>里的表单控件的值，才能提交给服务器)

  属性

    1.action  提交给服务器处理程序的地址（动作）

    2.method 提交方式，以什么样的方式把数据交给服务器

      get 

        以明文的方式将数据传递给服务器（提交的数据会显示在地址栏上）

        安全性低

        提交数据更大限制为2KB

        向服务器要数据时可以使用

      post

        以隐式的方式将数据传递给服务器

        安全性很高

        不限制提交数据的大小

        要提交数据给服务器处理时使用

      enctype

         作用：指定表单数据进行编码的方式

         取值：

             1、application/x-www-form-urlencoded

                 默认值，允许将任意类型的文本提交给服务器

             2、multipart/form-data

                 允许将文件提交给服务器

             3、text/plain

                 不对任何数据进行编码和传输

input元素  <input> （里边会包含若干个不同的表单控件）

  1.属性：

    1.type  根据不同的type属性值，可以创建不同的input元素

    2.name  定义表单控件的名称，主要提交给服务器使用的（如果不声明name属性的话，元素无法提交给服务器）

    3.value  定义当前控件的值，主要提交给服务器使用

    2.disabled  禁用控件，无值的属性  <input disabled>

  2.文本框与密码框

    文本框 ：<input type="text">

    密码框 ：<input type="password">

    具备除以上四个属性外，还具备以下几个独立属性：

       1、maxlength    限制输入的字符数，取值为数字

       2、readonly    只读，无值属性

           Q : readonly 和 disabled 的区别

           1、readonly ，是只读的意思，是允许提交给服务器，不让用户改数据而已

           2、disabled ， 是禁用的意思，不仅不让用户改数据，而且还不能提交给服务器

        3、placeholder占位符，即默认显示在文本框用于给用户提示的文字

  3.按钮

    1.提交按钮   将表单提交给服务器

      语法：<input type="submit" value="显示的文本">

    2.重置按钮  将表单恢复到初始化的状态

      语法：<input type="reset" value="显示的文本">

    3.普通按钮  通过JS自定义功能

      语法： <input type="button" value="显示的文本">

    4.<button>显示的文本</button>

        属性：type :  submit / reset / button

  4.单选按钮 和 复选框

    单选按钮 ：<input type="radio">

    复选框 ：<input type="checkbox">

    属性：

      name  设置名称，并用于分组，一组单选按钮或复选框的名称必须相同

      value  必须设置

      checked  默认被选中，无值属性

  5.隐藏域和文件选择框

    隐藏域  <input type="hidden" name=" " value=" ">  

      想要提交给服务器，但又不想给用户看的数据

    文件选择框  <input type="file" name=" ">

      form的method属性值必须为post

      form的enctype属性值必须为 multipart / form-data

textarea控件 （多行文本域） <textarea></textarea>

  属性：

    name ：定义名称，提交给服务器使用

    cols ：指定文本与的宽

    rows ：指定文本域的高

    readonly ：只读

选项框

  语法：

    <select></select>  表示下拉列表或滚动列表

    <option></option>  列表中的内容，允许出现多个

  属性：

    <select>

      name：控件名称

      size ：默认显示选项数量，默认为1，为下拉列表，如果取值>1,则为滚动列表

      multiple：设置多选，无值的属性（仅滚动列表使用，如果加上就会默认为滚动列表）

    <option>

      value ：选项的值，提交给服务器用

      select ：默认被选中（作用在下拉列表中）

其他标记

lable元素

  语法： <label>文本</label>

  属性 ：for ：指定要关联的表单控件的ID值

浮动框架  （将其他页面导入到当前页面中来）

  语法：<iframe></iframe>

  属性：

    src ：要引入页面的url

    frameborder ：指定浮动框架的边框，默认为1，则显示边框，不需要边框则指定为0

    width

    height

新input元素（支持HTML5）

  电子邮件类型（提交时会验证数据是否符合Email的规范）  <input type=”email”>

  搜索类型（在文本框的基础上，提供了快速清除操作）  <input type=”search”>

  URL类型（提交时会验证数据是否符合web站点的URL规范 路径） <input type=”url”>

  电话号码类型（在移动端设备中，能展开 拨号键盘，在PC中无效） <input type=”tel”>

  数字类型（只能让用户输入或选择数字） <input type=”number”>  

    属性：min：最小值，max：更大值，step：微调数值（默认为1）

  范围类型（提供一个滑块，让用户选择数字） <input type=”range”>

    属性：min ：最小值，max ：更大值，value ：初始值

  颜色类型（提供颜色拾取控件） <input type=”color”>

  日期类型（提供一个日期输入控件） <input type=”date”>

  周类型（提供一个日期控件，用于选取周） <input type=”week”>

  月份类型（选取月份控件） <input type=”month”>