HTML(2)

201 阅读5分钟

这是我参与8月更文挑战的第12天,活动详情查看:8月更文挑战

表格标签

<table></table>

意义:标签定义 HTML 表格一个 HTML 表格包括

元素,一个或多个、
以及元素

属性及属性值:

  • border:"1"
  • 规定表格单元是否拥有边框。

查看效果:

<tr></tr>

意义:元素定义表格行

属性及属性值:

align:

  • right
  • left
  • center
  • justify
  • char
  • 定义表格行的内容对齐方式。

全局属性

事件属性

查看效果:元素定义表格行

<th></th>

意义:元素定义表头

属性及属性值:

  • colspan: number
  • 规定表头单元格可横跨的列数。
  • headers: header_id
  • 规定与表头单元格相关联的一个或多个表头单元格。
  • rowspan: number
  • 规定表头单元格可横跨的行数。
  • scope
  • col
  • colgroup
  • row
  • rowgroup
  • 规定表头单元格是否是行、列、行组或列组的头部。

查看效果:元素定义表头

<td></td>

意义:元素定义表格单元

属性及属性值:

  • colspan: number
  • 规定单元格可横跨的列数。
  • headers: header_id
  • 规定与单元格相关联的一个或多个表头单元格。
  • rowspan: number
  • 设置单元格可纵跨的行数。

查看效果:元素定义表格单元

<caption></caption>

意义:定义表格的标题。

属性及属性值:

全局属性

事件属性

查看效果:定义表格的标题。

form表单标签

<form></form>

意义:用于创建供用户输入的 HTML 表单

属性及属性值:

  • accept: MIME_type
  • HTML5 不支持。规定服务器接收到的文件的类型。(文件是通过文件上传提交的)
  • accept-charset: character_set
  • 规定服务器可处理的表单数据字符集。
  • action: URL
  • 规定当提交表单时向何处发送表单数据。
  • autocomplete:
  • on
  • off
  • 规定是否启用表单的自动完成功能。
  • enctype:
  • application/x-www-form-urlencoded
  • multipart/form-data
  • text/plain
  • 规定在向服务器发送表单数据之前如何对其进行编码。(适用于 method="post" 的情况)
  • method:
  • get
  • post
  • 规定用于发送表单数据的 HTTP 方法。
  • name: text
  • 规定表单的名称。
  • novalidate: novalidate
  • 如果使用该属性,则提交表单时不进行验证。
  • target:
  • _blank
  • _self
  • _parent
  • _top
  • 规定在何处打开 action URL。

<input>

意义:规定了用户可以在其中输入数据的输入字段

属性及属性值:

  • name: text
  • name 属性规定 元素的名称。
  • value: text
  • 指定 元素 value 的值。
  • type:
  • text 定义单行的输入字段,用户可在其中输入文本。默认宽度为 20 个字符。
  • password 定义密码字段。该字段中的字符被掩码。
  • radio 定义单选按钮。
  • checkbox 定义复选框。
  • submit 定义提交按钮。提交按钮会把表单数据发送到服务器。
  • type 属性规定要显示的 元素的类型
  • checked: checked
  • checked 属性规定在页面加载时应该被预先选定的 元素。 (只针对 type="checkbox" 或者 type="radio")
  • autofocus: autofocus
  • 属性规定当页面加载时 元素应该自动获得焦点。
  • readonly: readonly
  • readonly 属性规定输入字段是只读的。
  • disabled: disabled
  • disabled 属性规定应该禁用的 元素。
  • placeholder: text
  • placeholder 属性规定可描述输入 字段预期值的简短的提示信息 。
  • required: required
  • 属性规定必需在提交表单之前填写输入字段。
  • tabindex:
  • 负值 表示元素是可聚焦的,但是不能通过键盘导航来访问到该元素
  • 0 表示元素是可聚焦的,并且可以通过键盘导航来聚焦到该元素
  • 正值 表示元素是可聚焦的,并且可以通过键盘导航来访问到该元素;它的相对顺序 按照tabindex 的数值递增而滞后获焦

查看效果:

<textarea></textarea>

意义:定义一个多行的文本输入控件

  • autofocus: autofocus
  • 规定当页面加载时,文本区域自动获得焦点。
  • cols: number
  • 规定文本区域内可见的宽度。
  • disabled: disabled
  • 规定禁用文本区域。
  • form: form_id
  • 定义文本区域所属的一个或多个表单。
  • maxlength: number
  • 规定文本区域允许的最大字符数。
  • name: text
  • 规定文本区域的名称。
  • placeholder: text
  • 规定一个简短的提示,描述文本区域期望的输入值。
  • readonly: readonly
  • 规定文本区域为只读。
  • required: required
  • 规定文本区域是必需的/必填的。
  • rows: number
  • 规定文本区域内可见的行数。
  • wrap:
  • hard
  • soft
  • 规定当提交表单时,文本区域中的文本应该怎样换行。

<select></select>

意义:用来创建下拉列表

属性及属性值:

  • autofocus: autofocus
  • 规定在页面加载时下拉列表自动获得焦点。
  • disabled: disabled
  • 当该属性为 true 时,会禁用下拉列表。
  • form: form_id
  • 定义 select 字段所属的一个或多个表单。
  • multiple: multiple
  • 当该属性为 true 时,可选择多个选项。
  • name: text
  • 定义下拉列表的名称。
  • required: required
  • 规定用户在提交表单前必须选择一个下拉列表中的选项。
  • size: number
  • 规定下拉列表中可见选项的数目。

<option></option>

意义:定义下拉列表中的一个选项

属性及属性值:

  • disabled: disabled
  • 规定此选项应在首次加载时被禁用。
  • label: text
  • 定义当使用 时所使用的标注。
  • selected: selected
  • 规定选项(在首次显示在列表中时)表现为选中状态。
  • value: text
  • 定义送往服务器的选项值。

<label></label>

意义:为 input 元素定义标注(标记)

属性及属性值:

  • for: element_id
  • 规定 label 与哪个表单元素绑定。
  • form:form_id
  • 规定 label 字段所属的一个或多个表单。