一、 label标签

1,如果你想让点击input输入框左边的文字就可以让输入框获取焦点,就可以使用label标签把文字和input包裹起来。
2,如果label里面有多个表单,想定位到某个,可以通过 for id的格式来实现。
示例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
  <label>姓名:<input type="text"></label><br/><br/><br/>
  <label for="two">电话: <input type="number"> <input type="number" id="two"></label>
</body>
</html>

预览

ios label 限制html label html5_提交表单

二、textarea标签

该标签用于创建可以输入多行的文本框,文本区域中可容纳无限数量的文本,其中的文本的默认字体是等宽字体。
属性:

属性


描述

autofocus

autofocus

使文本框获取焦点

cols

number

指定文本域内可见的列数

rows

number

指定文本域内可见的行数

disabled

disabled

禁用文本区域

form

form_id

定义文本区域所属的一个或多个表单。

maxlength

number

允许输入的最大字数

name

text

文本的名称

placeholder

text

文本的剪短提示

readonly

readonly

文本只读

required

required

文本为必填项

wrap

soft或者hard

soft时:在表单提交时,textarea中的文本不换行。默认值,hard:在提交表单时,textarea中的文本换行(包含换行符),当使用“hard”时,必须指定cols属性。

示例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
  <form action="">
    <textarea rows="10" cols="20" placeholder="说出您的感想~" autofocus></textarea>
    <input type="submit">
  </form>

</body>
</html>

预览:

ios label 限制html label html5_ios label 限制html_02

三、select 标签

用来创建下拉列表,列表项用option定义,select 元素可创建单选或多选菜单。当提交表单时,浏览器会提交选定的项目,或者收集用逗号分隔的多个选项,将其合成一个单独的参数列表,并且在将 表单数据提交给服务器时包括 name 属性。
属性

属性


描述

autofocus

autofocus

获取焦点

disabled

disabled

禁止点击选择

form

form_id

定义select所属的表单

multiple

multiple

设置为可多选

name

name

定义下拉列表的名字

required

required

提交表单时必须选择一个

size

number

规定下拉选项的可见数量

示例:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
选择你喜欢的四大名著之一:
<select autofocus size="1">
  <option>西游记</option>
  <option>红楼梦</option>
  <option>水浒传</option>
  <option>三国演绎</option>
</select>
<br/><br/><br/><br/>
选择你喜欢的职业:
<select size="3" multiple>
  <option>老师</option>
  <option>医生</option>
  <option>会计</option>
  <option>厨师</option>
  <option>护士</option>
  <option>飞行员</option>
  <option>空姐</option>
  <option>程序员</option>
  <option>产品经理</option>
</select>
</body>
</html>

预览:

ios label 限制html label html5_html_03