day3

day3

• 表格

  • 学习了在HTML中创建表格

    1.table 用于定义一个表格
    2.tr 是定义表格中的一行，必须嵌套在table标签内，table中包含几对tr就有几行表格
    3.td 就是单元格，必须嵌套在tr标签内，tr有几个td就表示有几个单元格(就是几列)
    

  • 注意事项

    tr 中只能嵌套 td
    td下可以有任意元素
    

  • 属性

    学习了border的属性，border（边框） 默认值为0，像素值（px），它的属性有cellspacing,cellpadding,width,height,align

  • 表头标签

    表头一般位于表格的第一行或第一列，其文本加粗居中，即为设置了表头的表格。设置表头非常简单，只需用表头标签<th></th>替代相应的单元格标签<td></td>即可。

  • 结构

    可将表格分为头部、主体和页脚。
    <thead></thead>用于定义表格头部，必须在lable标签内。
    <tbody></tbody>用于定义表格主体，位于lable标签内，一般包除头部和底部之外的其他内容。
    

  • 标题

    caption（表格的标题）

  ​ caption 标签必须紧随 table 标签之后。您只能对每个表格定义一个标题。通常这个标题会被居中于表格之上。

  • 合并单元格

    rowspan(跨行),colspan(跨列)可用来合并单元格

    公式： 删除的个数 = 合并的个数 - 1

    合并的顺序 先上 先左

• 表单

  • 表单控件

    例如：单行文本输入框、密码输入框、复选框、提交按钮、重置按钮等。

  • 表单域

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

  • input控件(熟悉使用)

  单标签 br，hr，input
  

  属性	属性值	描述
  type	text	单行文本输入框
  	password	密码输入框
  	radio	单选按钮
  	checkbox	多选按钮
  	button	普通按钮
  	submit	提交按钮
  	reset	重置按钮
  	image	图像形式的提交按钮
  	file	文件域
  name	由用户自定义	控件的名称
  value	由用户自定义	input控件中的默认值
  size	正整数	控件在页面中显示的宽度
  checked	checked	定义选择控件中默认被选中的项
  maxlength	正整数	控件允许输入的最大字符数

  在上面的语法中，<input />标签为单标签，type属性为其最基本的属性，其取值有多种，用于指定不同的控件类型。除了type属性之外，<input />标签还可以定义很多其他的属性，其常用属性如下表所示。

  • label标签

    今天的学习label重点在于使用for规定label与表单元素绑定

  • textarea控件(文本域)

    输入大量的信息就使用textarea

  • select(下拉菜单)

    1.select></select>中至少应包含一对<option></option>。

    2.在option 中定义selected =" selected "时，当前项即为默认选中项。

  • 表单域(form)

    action:  url地址
    method:  提交方式
    name :  表单的名称，区分同一界面的多个表单
    

• HTML5

  • 类型

    • document
      • HTML: sublime 输入 html:4s
      • XHTML: sublime 输入 html:xt
      • HTML5 sublime 输入 html:5

  • 常用新标签

    • header：定义文档的页眉 头部

    • nav：定义导航链接的部分

    • footer：定义文档或节的页脚 底部

    • article：定义文章。

    • section：定义文档中的节（section、区段）

    • aside：定义其所处内容之外的内容 侧边

    • datalist 标签定义选项列表。请与 input 元素配合使用该元素

    • fieldset 元素可将表单内的相关元素分组，打包 legend 搭配使用

      legend:标题

  • 新增input type属性值

    类型****	使用示例****	含义****
    email****		输入邮箱格式
    tel****		输入手机号码格式
    url****		输入url格式
    number****		输入数字格式
    search****		搜索框（体现语义化）
    range****		自由拖动滑块
    time****		小时分钟
    date****		年月日
    datetime****		时间
    month****		月年
    week****		星期 年

  • 常用新属性

    属性****	用法****	含义****
    placeholder****		占位符 当用户输入的时候 里面的文字消失 删除所有文字，自动返回
    autofocus****		规定当页面加载时 input 元素应该自动获得焦点
    multiple****		多文件上传
    autocomplete****		规定表单是否应该启用自动完成功能 有2个值，一个是on 一个是off on 代表记录已经输入的值 1.autocomplete 首先需要提交按钮 2.这个表单您必须给他名字
    required****		必填项 内容不能为空
    accesskey****		规定激活（使元素获得焦点）元素的快捷键 采用 alt + s的形式

• 多媒体

  • audio(播放音频)，video(播放视频)

  • audio，video属性

    autoplay 动播放

    controls 是否显不默认播放控件

    loop 循环播放 loop = 2 就是循环2次 loop 或者 loop = “-1” 无限循环

    其中video还可使用width 设置播放窗口宽度，height 设置播放窗口的高度

  下午的时候使用表格来做了老师布置的任务，熟悉了今天的内容。