加入收藏 | 设为首页 | 会员中心 | 我要投稿 晋中站长网 (https://www.0354zz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 站长学院 > MySql教程 > 正文

html5定制表单_动力节点Java学院整理

发布时间:2020-03-17 13:42:28 所属栏目:MySql教程 来源:站长网
导读:副标题#e# HTML5中存在多种不同的输入框和按钮,通过设置input元素的type属性来实现,除此之外,HTML5中还支持选择列表、多行输入框等,这些元素都有自己的用途和属性,下面一一介绍。 单行文本输入框 type为text表示input元素为一个单行文本框,是input元

<form method="post" action=":8080/form" enctype="multipart/form-data"> <p><label for="name">Name: <input value="Adam" disabled id="name" name="name"/></label></p> <p><label for="password">Password: <input type="password" placeholder="Min 6 characters" id="password" name="password"/></label></p> <p><label for="fave"> Favorite Fruit: <select id="fave" name="fave"> <option valu="apples" selected label="Apples">Apples</option> <option valu="oranges" label="Oranges">Oranges</option> <option valu="cherries" label="Cherries">Cherries</option> <option valu="pears" label="Pears">Pears</option> </select> </label></p> <input type="submit" value="Submit Vote"/> </form>

在chrome中的效果如下:


 

复选框

为列表设置size属性和multiple属性后,就成为一个复选框。

<form method="post" action=":8080/form" enctype="multipart/form-data"> <p><label for="name">Name: <input value="Adam" disabled id="name" name="name"/></label></p> <p><label for="password">Password: <input type="password" placeholder="Min 6 characters" id="password" name="password"/></label></p> <p><label for="fave"> Favorite Fruit: <select id="fave" name="fave" size="5" multiple> <option valu="apples" selected label="Apples">Apples</option> <option valu="oranges" label="Oranges">Oranges</option> <option valu="cherries" label="Cherries">Cherries</option> <option valu="pears" label="Pears">Pears</option> </select> </label></p> <input type="submit" value="Submit Vote"/> </form>

在点击选项时按住Ctrl键,就可以选择多个选项。在chrome中效果如下:

带结构的列表

optgroup元素可以用来在select元素的内容中建立一定的结构,该元素支持的属性包括:
1)label:用来为整组选项提供一个小标题;
2)disabled:灰化选择组内的任何选项。

(编辑:晋中站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读