HTML-列表-表格-表单知识点

``1.列表元素
  无序列表 ul li  新闻/导航栏
    有序列表的作用: 给一堆数据添加列表语义, 并且这一堆数据中所有的数据都有先后之分
    <ul type="value">
      <i>展示数据 </i>
    </ul>
    disc    默认值 实心圆
    circle  空心圆
    square  实心方块
  有序列表 ol li  排名
     有序列表的作用: 给一堆数据添加列表语义, 并且这一堆数据中所有的数据都有先后之分
      <ol type="A">
       <li>展示数据</li>
      </ol>
      1   默认值。数字有序列表。（1、2、3、4）
      a   按字母顺序排列的有序列表，小写。（a、b、c、d）
      A   按字母顺序排列的有序列表，大写。（A、B、C、D）
      i   罗马字母，小写。（i, ii, iii, iv）
      I   罗马字母，大写。（I, II, III, IV）

  定义列表 dl dt dd
        给一堆数据添加列表语义，先通过dt标签定义列表中的所有标题, 然后再通过dd标签给每个标题添加描述信息
        dt的含义就是用来定义列表中的标题
        dd的含义就是用来定义标题对应的描述的

  表格标签
    一对table标签就是一个表格
​    一对tr标签就是表格中的一行
​    一对td标签就是一行中的一个单元格 
    <table>
      <tr>
        <td>内容</td>
      </tr>
    </table>
    1.表格标签有一个border边框属性, 这个属性决定了边框的宽度. 默认情况下这个属性的值是0, 所以看不到边框
    2.表格标签和列表标签一样, 它是一个组合标签, 所以table/tr/td要么一起出现, 要么一起不出现, 不会单个出现
    3.可以给table标签和td标签使用
    表格的宽高：默认是按照内容的尺寸来调整的
                手动改变：table的width、height
    单元格的宽高：td的width、height
    (行内样式：style="color:red" 优先级高)
    4.表格内单元格的水平，垂直对齐
      水平align: left center right
      table(表格在水平方向的对齐方式)  tr td(当前单元格内容的水平方向的对齐方式) 
      垂直 valign : top mid bottom  tr td (当前单元格中的内容在垂直方向的对齐方式) 

    5.表格外边距和内边距的属性
      cellspacing外边距就是单元格和单元格之间的距离, 为外边距默认2px
      cellpadding内边距就是单元格的边框和文字之间的间隙, 为内边距默认1px  

    6.  细线表格的制作方式:
      1.给table标签设置bgcolor="black"，cellspacing = "1px"
      2.给tr标签设置bgcolor="white"

    7.合并单元格
      colspan  水平合并 <td colspan="2"></td>
      rowspan 垂直合并 <td rowspan="2"></td>

    8.form表单元素
    <form action="提交的服务器接口地址">
      <表单元素>
    </form>

    input
    明文输入框 <input type="text" >
    暗文输入框 <input type="password" >
    单选框 <input type="radio" name="xx" value="xxx" checked> checked默认选中
    互斥操作，设置相同的name
    多选框 <input type="checkbox" name="xxx" value="xxx">
    下拉列表<select><option></option></select>

    提交按钮 <input type="submit">
    作用: 将表单中已经填写好的数据, 提交到远程服务器(action:服务器地址)
    注意：需要给需要提交到服务器的表单元素添加一个name属性

    普通按钮 <input type="button" value="xxx">
    图片按钮 	<input type="image" src="">
    重置按钮 <input type="reset" value="xx">
    隐藏域 <input type="hidden" name="xx" value="xxx">`