一句话概括主题:<button>具有<input type="button" ... >相同的作用但是在可操控性方面更加强大。

HTML 4.01规范的Forms部分指名表单有以下几种控制类型:buttons, checkboxes, radio buttons, menus, text input, file select, hidden controls, object controls. 其中除了buttons/menus/object controls之外,都是由<input>完成。

我这里说的是<button>和<input>。

<button>和<input>
规范中指名:可以用<button>和<input>来做表单按扭。不同的按钮类型请参考这些元素的详细定义。要注意的是<button>比<input>支持更丰富的表现功能。

一些区别
大家都知道<input>可以这样用(实际上是一定要这样用):<input type="submit" value="OK" />,一定要这样闭合。而不是:<input type="submit" value="OK" ></input>。因为起始标签为必须,而关闭标签是禁止的。

<button>比<input>更厉害的地方就在于它可以包含内容。它的值并不是写在value属性里,而是包含在标签中。 如:<button>OK</button>。<button>的起始标签和关闭标签都是必须的。这样你便获得了样 式化的主导权。

你可以这样写:<button><strong>OK</strong>, I do.</button>,甚至是插入图片:<button><img src="button.gif" alt="" />, it's great.</button>。有点类似于<input type="image">,但是显然强大多了。

最后要注意的是,被<button>包含的图片,不能使用热点地图,即不能<img src="foo.gif" usemap="..." />,这是不合法的。当然也不能再包含诸如input, select, textarea, label, button, form, fieldset, iframe,和isindex(不推荐使用)元素了。

非原创,来源网络。

BUTTON标签和INPUT标签的区别【转】的更多相关文章

  1. 表单相关标签之input标签

    用于搜集用户信息. <input type="text" name="fname" /> 标签属性 type 规定 input 元素的类型.输入字段 ...

  2. 在写移动端时,a标签或者input标签等 在手机上点击背后会有阴影的解决办法

    a,input{-webkit-tap-highlight-color:rgba(255,0,0,0);} 被背景设置成透明的就行了

  3. springMvc <form:form>标签 <form:input>标签需要注意的问题

    在用springMVC <form:form>表单时,喜欢报的错误如下所示: 错误的Controller层的代码如下: @RequestMapping(value = "test ...

  4. 使用textarea标签代替input标签可以实现输入框的大小调节,自动换行,滚动条显示

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. input 标签和a标签实现超链接的区别

    a 标签和 input 标签都可以做链接点击的.代码: ------------------------------------------------------------------------ ...

  6. 关于编辑器对<input>标签报错提示“表单输入没有相关label”的问题

    相信很多朋友在制作表单的时候,我们的编辑器会有下图的相关提示吧 我们发现虽然这样并不影响我们的正常使用,但是看着这样的报错提示总是很让人心烦,那么这到底是为什么呢? 其实,这是因为编辑器建议我们在使用 ...

  7. Dom,查找标签和操作标签

    Dom,查找标签和操作标签 文档对象模型(Document Object Model,DOM)是一种用于HTML和XML文档的编程接口.它给文档提供了一种结构化的表示方法,可以改变文档的内容和呈现方式 ...

  8. 表单相关标签之form标签

    表单能够包含 input 元素,比如文本字段.复选框.单选框.提交按钮等等. 表单还可以包含 menus.textarea.fieldset.legend 和 label 元素以及其它块级元素 表单用 ...

  9. <button>标签与<input type="button">标签

    <script type="text/javascript" src="/jquery-1.11.3.min.js"></script> ...

随机推荐

  1. C#Base64编码

    一. Base64的编码规则 Base64编码的思想是是采用64个基本的ASCII码字符对数据进行重新编码.它将需要编码的数据拆分成字节数组.以3个字节为一组.按顺序排列24 位数据,再把这24位数据 ...

  2. Hello Hibernate

    Hibernate 一个框架; 一个 Java 领域的持久化框架; 一个 ORM 框架 ORM(Object/Relation Mapping): 对象/关系映射 –ORM的思想:将关系数据库中表中的 ...

  3. IT公司100题-18-圆圈中最后剩下的数字

    问题描述: n个数字(下标为0, 1, …, n-1)形成一个圆圈,从数字0开始,每次从这个圆圈中删除第m个数字(当前数字从1开始计数).当一个数字被删除后,从被删除数字的下一个数字开始计数,继续删除 ...

  4. 利用K2和Microsoft Dynamics CRM构建业务App的5大理由

    Microsoft Dynamics CRM提供了一个绝佳的客户关系管理平台,使您能够创建各种以客户为中心的解决方案.然而,通过将K2的企业业务流程功能与Microsoft Dynamics CRM相 ...

  5. 合理利用 vs2013的性能分析跟诊断

    选择对应的项目==> 我正常是选择采样 就包括里面的一些耗时.  挺好用的. 可以根据热路径 还有访问的占比.知道哪个环节占用的访问时间 还有性能耗能多. 可以点进去 跟踪跟修改

  6. 使用Google API 下拉刷新或者增加数据 SwipeRefreshLayout

    贴出布局代码: <android.support.v4.widget.SwipeRefreshLayout android:id="@+id/id_swipe_ly" and ...

  7. 宏定义#define和typedef的区别和典型范例题目辨析

    宏定义#define pStr char*  ,是直接把程序中出现pStr的地方替换成char* ,直接替换: typedef  char * pStr; 是给char*定义一个别名叫做 pStr; ...

  8. python tuple 操作

    特点:不可改(与字符串一样.不允许删除和修改) 操作:1.print 可使用跟%的元祖  print( '%s is %d years old' % (name, age)) 2.像列表一样有索引 3 ...

  9. c++父类指针强制转为子类指针后的测试(帮助理解指针访问成员的本质)(反多态)

    看下面例子: #include "stdafx.h" #include <iostream> class A {  //父类 public: void  f()   / ...

  10. Ubuntu 14.10 下安装MySQL

    在Ubuntu上安装MySQL很简单,只需要几个命令行 1 安装服务器 sudo apt-get install mysql-server 2 安装客户端 sudo apt-get install m ...