一、input标签属性介绍

input标签有许多属性,如:type,name,id,value,style

  • name属性:表示元素的名称,也就是name的值代表当前input元素的名字;
  • id属性:用于css引用或者其他引用
  • value属性:表示当前input框内显示的文字
  • style属性:用于设置css样式。如颜色,背景色等
  • type属性:用于设置输入框的类型,最重要的属性

如图:

以上属性中,type属性最重要,接下来讲解其type属性。



二、input标签的type属性详述

其type属性有多种类型:

  •                         文本框(type=text),
  •                         按钮(type=button),
  •                         单选(type=radio)
  •                         复选(type=checkbox)
  •                        下拉列表(type=select)
  •                        文本域(type=textarea)

如图:用Input标签,利用其type属性,从而可以设置一系列表单元素,input表签放在form表单中。

如:以下便是一个表单区域,用于收集家长的建议与反馈


三、input的type属性

1.文本框

运行结果:


 

2.密码框

运行结果:

注:密码框与文本框的区别:密码框输入的内容不可见,而文本框可见。


 

3.提交按钮

运行结果:


 

4.重置按钮

运行结果:

注:作用在于清空输入的信息。



 

5.单选框

运行结果:


6.复选框(多选框)

运行结果:


7.下拉列表框

运行结果:



 

8.文本域

运行结果:

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐