表单按钮

38 阅读1分钟

表单按钮

表单可以实现按钮效果:

  • 普通按钮(type=button):使用value属性设置按钮文字
  • 重置按钮(type=reset):重置它所属form的所有表单元素(包括input、textarea、select)
  • 提交按钮(type=submit):提交它所属form的表单数据给服务器(包括input、textarea、select)

image.png 我们也可以通过按钮来实现。

image.png

input和label的关系

label元素一般跟input配合使用,用来表示input的标题。labe可以跟某个input绑定,点击label就可以激活对应的input变成选中。

image.png

radio的使用

我们可以将type类型设置为radio变成单选框。name值相同的radio才具备单选功能。

checkbox的使用

我们可以将type类型设置为checkbox变成多选框。属于同一种类型的checkbox,name值要保持一致。

textarea的使用

textarea的常用属性:

  • cols:列数
  • rows:行数

缩放的CSS设置:

  • 禁止缩放:resize: none;
  • 水平缩放:resize: horizontal;
  • 垂直缩放:resize: vertical;
  • 水平垂直缩放:resize: both;