表格，表单，列表元素

• 列表元素
  • 方案一、div进行编写（更自由）
  • 方案二、使用列表元素ul / li（一般：ul里只放li，所以更稍显死板）
  • HTML提供了3组常用的展示列表的元素：
    • 有序列表：ol，li
      • ol（有序列表）：直接子元素只能是 li
      • li：列表中的某一项
    • 无序列表：ul，li
      • 无序列表 ul：直接子元素也只能是 li
    • 定义列表：dl，dt，dd
      • dl 定义列表：直接子元素只能是 dt、dd
      • dt：列表中每一项的项目名
      • dd：列表中每一项的具体描述
• 前端学习大纲体系
  • 三大阶段：

    

• 案例总结
  • 注意事项：

    

  • <!-- 写网页的结构：
  • 1. 先完成结构
  • 2. 重置样式（body/a/ul/li）
  • 3. 先整体，后局部
  • *最好按照结构的顺序
  • 顺序：按照从外往里，从上往下
  • 4. 去除重复代码（css）
  • *将重复的逻辑放到一个单独的class中（.icon）
  • *不同的代码抽到不同的class（.new .hot）
  • * -->*
• 表格元素
  • table 表格
  • tr 表格中的行
  • td 行中的单元格
  • 表格语义化：

    

  • 示例：

    

  • 单元格合并
    • 跨列合并：colspan
    • 跨行合并：rowspan
    • 示例：

      

• 表单元素
  • 列表，表格，表单元素区分：
    • 列表：ol/ul/li/dl/dt/dd
    • 表格：table/tr/td/thead/tbody/th/tfoot
    • 表单元素：form/input/select/option/textarea
  • form：表单
    • name：单独地在一个网页里面，一个控件是否设置它的 name 属性是不会影响到这个网页的功能实现的。但是，当我们需要把这个控件所关联的数据传递到数据库时，就必须要设置 name 属性，否则，这个值是没有办法传到服务器上面得到保存的。
    • value代表某个html标签的值
    • name和value的区别：name一般是在设置单选按钮（如性别）时，把多个单选按钮name设置相同，分为一组，这样就可以实现关联如性别的男和女只能选一个不能同时选两个，value是初始值，就是你设置按钮时想要按钮里面带文字就需要设置value了如<input type="submit" />这样按钮里是没文字的，加上value后就有了<input type="submit" value="提交"/> 按钮里会出现提交。
    • action在form提交时的作用：提交数据的url地址，method：确定请求方式（get/set），target：确认打开方式是否在新的页面中
  • input：输入框
    • input元素常见属性：

      

    • input实现按钮的效果：

      

    • label元素：

      

    • 单选框radio：name值相同的radio才具备单选功能
    • 示例：

      

    • checkbox多选框：
    • 示例：

      

    • 多行输入textarea：

      

    • 选项列表select-option：

      

  • textarea：多行文本输入
  • select，option：下拉选择框
  • button：按钮
  • label：表单元素的标题
  • form：通常作为表单元素的父元素
• 请求方式对比：get和post请求
  • get请求：密码，账号为明文，post请求：密码为密文