2 HTML元素大全-表单( 四 ) _生活百科

resize设置输入框的大小调整方式。
<p><label for="txtsumary">个人简介：</label><textarea name="txtsumary" rows="3" cols="50" style="resize: vertical;" required>多行文本内容，支持空格、换行</textarea></p>

文章插图
04、<label>辅助表单聚焦<label>是一个文本标签，最主要的使命是辅助表单元素聚焦，点击<label>会让其for关联的元素得到焦点， for属性值所指的元素id就是她的服务客户。因此<label>是表单控件的最佳搭档，点击label=等于点击对应元素。<label>是一个双标签，里可以嵌套其他行内元素，如文字、图片、表单元素。
属性描述for关联的元素idform<form>的id ，可以将<label>放到form外面了，这就很自由了！

<p><label for="uname"><span>Name:</span><input id="uname" type="text" name="uname"><span title="required">*</span></label></p><div><label for="username">Name: <span title="required">*</span></label><input id="username" type="text" name="username"></div><label><input type="checkbox" />阅读并同意条款<img src="https://www.huyubaike.com/res/head-48.gif" width="24px"></label>

文章插图

还有一种简写的方式：用 label 元素把 input 元素包裹起来，以减少for- id 的使用。

05、<button>按钮<button> 是HTML5的新元素，行内元素，作用和input-button的功能基本相同。不同的是他是双标签 ，内部可以自由定义内容，也可以使用伪元素，实现更丰富的按钮效果，所以按钮用他就对了。
属性描述值type按钮的类型button：普通按钮；submit：表单提交按钮；reset：表单重置按钮；valuebutton 的初始值，参数的形式随表单提交

<button type="button">普通按钮</button><button type="submit">提交submit</button><button type="reset" style="width:80px;"><img src="https://www.huyubaike.com/res/sk (13).png"><br/>重置</button>

文章插图
<button>和<input button>的区别？

<input>是单标签，无关闭标签。
<button>的显示内容在标签之间，应用场景更丰富；<input>的显示内容在value属性上，只支持纯文本。
<button>的鼠标事件里可以直接写代码。

06、<select/option>选项<select>选择列表元素，行内元素，有弹出下拉框、选项列表两种模式， <option>是他的选项子元素。启用multiple或size>1时，显示为列表，否则显示为下拉框模式。
元素/属性描述值/备注<select>选项控件?required必填，表单的通用属性，还有disabled、autofocus、form等?multiple多选，显示为列表，不设置该属性则弹出下拉框。值也是multiple ，值可省略?size控件显示的选项行数，配合multiple使用整数，默认1?value/selectedIndex选中的值/索引<option>