一句话概括主题:<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. mac 下隐藏和显示文件

    显示:defaults write com.apple.finder AppleShowAllFiles -bool true隐藏:defaults write com.apple.finder Ap ...

  2. 【NOIP模拟_54测试】【并查集】【二进制】【搜索】【区间序列类】

    第一题 Mushroom的序列 大意: 给一个序列,求一段连续最长区间满足:最多改变一个数,使得区间是严格的上升子序列. 解: 直接扫描一遍,记一个最长上升子序列编号.然后从每一个编号为1 的点来判断 ...

  3. asp.net mvc 2.o 中使用JQuery.uploadify

    From:http://www.cnblogs.com/strugglesMen/archive/2011/07/01/2095916.html 官方网站http://www.uploadify.co ...

  4. HDU 1203-Program D

    Description Speakless很早就想出国,现在他已经考完了所有需要的考试,准备了所有要准备的材料,于是,便需要去申请学校了.要申请国外的任何大学,你都要交纳一定的申请费用,这可是很惊人的 ...

  5. 本节向大家介绍一下UML建模误区

    本节向大家介绍一下UML建模误区,这里向大家介绍九个误区,希望通过本节的学习,你对UML建模有清晰的认识,以免在以后使用过程中产生不必要的麻烦.下面让我们一起来看一下这些建模误区吧. UML建模误区 ...

  6. Android 自带图标库 android.R.drawable

    在xml文件中调用. android:title="@string/secure_connect"android:orderInCategory="100"an ...

  7. sql 之CONCAT用法

    这是java交流群里一个网友面试的时候发过来的笔试题,我觉得题目的假定条件应该是某个字母对应的最小数字只有一个. 思路第一步是查出一个子表s1: select name,min(number) fro ...

  8. linux学习笔记3:linux的网络配置,rpm包,shell以及samba服务器的使用和安装

    1.linux下的shell<linux命令.编辑器和shell编程> (1)shell种类有很多,常用的有三种,在linux可以通过ls -l /bin/*sh 来显示所有已安装的she ...

  9. 转:Java面试题集(1-50)

    Java程序员面试题集(1-50) http://blog.csdn.net/jackfrued/article/details/17403101 一.Java基础部分 1.面向对象的特征有哪些方面? ...

  10. Canopy使用教程 (2)

    1.下载https://reputation.alienvault.com/reputation.data alienvault公司的IP信誉数据库文件到本地,手动或者wget 2.使用 read_c ...