html取消按钮框线_按钮组大总结，赶紧收着《一》

本来想的是每个类型的按钮分开写，但是分开写每篇字数太少。今天对按钮使用进行一个简单的总结，希望可以对大家有所帮助！

什么叫按钮组呢？

简单来说按钮组就是指两个活两个以上的按钮排布在一起。从按钮组的样式上我们可以看出常见的按钮组是供用户进行判断(两个选项)或者选择(两个以上选项)的。

按钮组可以包含切换按钮、复选框、单选按钮和开关等交互式图元，当一个图元被选中时，其他图元自动取消选中。

单行文本框

在HTML中，把< input>标签的type属性设置为text可以表示单行文本框，又叫做常规文本框，具体语法为：< input type="text" /> 默认值是type=“text”

value属性定义文本框中的值

maxlength属性在< form>表单中，允许使用maxlength属性设置文本框中最多可以输入的字符数量(包括空格)

size属性用来定义文本框可见的字符数，与maxlength不同的是，size定义的事文本框可见的字符数，当用户输入的字符数超出这个值时，还可以输入只是不再显示。

密码框< input type="password" />

网页中最典型的应用密码框的场景就是网站的登录注册页面。例如网站中的登录或者注册页面中的密码字段使用的就是密码框。

在HTML中，把< input>标签的type属性设置为password可以表示密码框。

密码框和单行文本框一样，也有maxlength、value以及size等属性。

maxlength属性表示密码框最多可以输入的字符数量。(进行设置后，当用户输入的密码大于6位，不再允许输入)

value属性用来表示密码框的默认值，一般密码都是由用户自行输入。

size属性表示文本框可见的字符数。

(单选按钮和复选框可以到我的主页里查看)

隐藏域< input type="hidden" name="#" value="#">

隐藏域是用来收集或发送信息的不可见元素，对于网页的访问者来说，隐藏域是看不见的。当表单被提交时，隐藏域就会将信息用你设置时定义的名称和值发送到服务器上

隐藏域的优点：1.不需要任何服务器资源

2.支持广泛，任何客户端都支持隐藏域

3.实现简单，隐藏域属于HTML控件，无需向服务器控件那样有需要编程知识

隐藏域的缺点：1.具有较高的安全隐患

2.存储结构简单

3.如果存储了较多的较大的值，则会导致性能问题

4.如果隐藏于过多，则在某些客户端中被禁止

5.隐藏域将数据存储在服务器上，而不存储在客户端

注意：如果开发中，页面的隐藏域过多，这些隐藏域被存储在服务器。当客户端浏览页面的时候，会有一些防火墙扫描页面，以保证操作系统的安全，如果页面的隐藏域过多，那么这些防火墙可能会禁止页面的某些功能。

文件上传< input type="file" />

文件上传是网站中一种常见的功能。在HTML中，把< input>标签的type属性设置为file就可以实现上传文件的功能，又叫做文件上传域。

enctype属性规定被提交数据的编码。如果提交数据中包含文件时，需要把< form>标签的enctype属性设置为multipart/form-data。

accept属性：限制文本类型支持逗号分隔的mime类型字符串

accept="image/png” 或者accept=".png"，只接受png图片。

accept="image/png,image/jpeg"或者accept=".png,.jpg,.jpeg",接受PNG和JPEG文件

accept="image/*",接受任何图片文件类型

multiple(多选)属性：当用户所在的平台允许使用shift或者contort键时，用户可以选择多个文件。如果不希望多选，可以直接忽略multiple属性

capture(调用设备媒体)属性：在webapp上使用input的file属性，指定capture属性可以调用系统默认相机、摄像和录音功能

下拉框< select>标签

下拉列表是网页中一种最节省页面空间的选择方式，默认状态下只现实一个选项，只有单击下拉按钮后才能看到全部的选项。

HTML下拉列表由< select>< option>配合使用的。

< select>

< option>< /option>

< /select>

其中< select>标签用来创建一个下拉列表， < option>标签表示下拉列表中的每一项(条目)。

< select>标签属性

1.name属性同所有它表单元素相同，下拉列表要想被正确提交，也需要设置name属性(不显示在页面上，主要用来提交数据)

2.size属性就是让页面显示多个选项

3.multiple属性就是允许用户选择多个选项

4.disabled属性可以禁用下拉列表，使其不能获得焦点或被修改

< option>标签属性

1.selected属性为< select>标签设置了mulyiple属性后，就可以通过 option>标签的selected="selected"实现某一项的余先选中。

2.value属性用来定义当下拉列表在提交时，发送给服务器的值，value值并不会显示在页面上(不显示在页面上)

3.disabled属性用于 禁用列表中的某一项

写这么多下来发现并不少，所以我决定分两篇文章来写！太多啦。。。。。

(ps:如果您觉得有用，请点赞转发，让更多人看到哦)