html< button>按钮标签

原创 PHP笔记  2017-05-11 21:22  阅读 1,636 views 次

在html中,<button>标签是用来定义一个按钮,在<button>标签中可以放置一些内容(文本、图像等)。 <input>标签也是可以用来定义按钮的,它和<button>标签的区别是<input>标签是单标签,没有元素内容,<input>标签要设置type属性为button才表示按钮,<button>标签是双标签,可以有元素内容,因此<button>标签有更强大的功能和更丰富的内容。

注意:

  1. 在html表单中创建按钮一般使用<input>标签,因为在表单中如果使用<button>标签,不同的浏览器会提交不同的值,必须设置type属性为button,不然默认是文本框。
  2. <button>标签最好都设置type属性,因为浏览器对<button>标签的type属性可能有不同的默认值。

属性

  • autofocus:当页面加载时按钮应当自动地获得焦点,html5新增。
  • disabled:应该禁用该按钮。
  • form :按钮属于一个或多个表单,html5新增。
  • formaction:覆盖 form元素的action属性,html5新增。
  • formenctype:覆盖form元素的enctype属性,html5新增。
  • formmethod:覆盖form元素的method属性,html5新增。
  • formnovalidate:覆盖form元素的novalidate属性,html5新增。
  • formtarget:覆盖form元素的target属性,html5新增。
  • name:按钮的名称。
  • type :按钮的类型(button、reset、submit)。
  • value:按钮的初始值。

<button>标签支持html全局属性和html事件属性

格式:

<button type="按钮的类型">按钮内容</button>

实例:

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>html< button>按钮标签_PHP笔记</title>
</head>
<body>
<h2>html< button>按钮标签演示<h2>
<button type="button">确定</button>
<button type="button">返回</button>
<button type="button"><img src="https://www.ggbiji.com/wp-content/themes/Nana2.09/avatar/default.jpg"/></button>
</body>
</html>
</html>

运行结果:

本文地址:https://www.ggbiji.com/html-button.html
版权声明:本文为 PHP笔记 原创/整理文章,欢迎分享,转载请注明出处!

发表评论


表情