Internship2

Internship2

表单与表格的创建

• 表单（form）

• from表单的标签，包含整个表单控件的标签

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

• label标签(理解)

• label 标签为 input 元素定义标注（标签）。

• 作用： 用于绑定一个表单元素, 当点击label标签的时候, 被绑定的表单元素就会获得输入焦点

• 如何绑定元素呢？

• for 属性规定 label 与哪个表单元素绑定。

• textarea控件（文本域）

• 如果需要输入大量的信息，就需要用到<textarea></textarea>标签。通过textarea控件可以轻松地创建多行文本输入框，其基本语法格式如下：

• 下拉菜单（select）

• 使用select控件定义下拉菜单的基本语法格式如下

• 注意

• select中至少包含已对option标签

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

• 常用新标签

• 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：播放视频

• table

• table:定义表格

• tr：表格中的一行，只能嵌套td

• td：单元格，可以有任意元素

• 表格属性

• border：边框， 默认值为0 像素值（px）

• cellspacing：设置单元格和单元格之间的间距像素

• cellpadding ：设置单元格内容和单元格的间距像素

• width：表格的宽度像素值

• height：表格的高度像素

• align：设置表格的水平对齐方式left，center，right

• 表头

• 表头的td可用th来代替

• 表格标题

• caption，用来定义表格标题

• 合并单元格

• 跨行合并：rowspan

• 跨列合并：colspan