<button class =“button”>标签vs <div class =“button”> </div> </button>

时间:2013-01-08 00:20:21

标签: html css standards w3c

在设计用户界面而不是使用<button>时使用html <div class="button">标记是否不正确?在实现中,我没有注意到两种方法之间存在差异,<button>似乎更具语义性,但我不确定它是否仅用于表单中。该按钮不在表单中。使用<div>标签似乎是制作按钮(引导程序)的最常用方法,但我不确定原因。这有什么技术原因吗?

2 个答案:

答案 0 :(得分:8)

最好使用<button>而不是<div>或任何其他元素来表示按钮。 “type”属性在这里很重要,应该是type="button",没有它,默认值为submit,这在表单之外没有意义。

顺便说一下,在表格外面<button>完全没问题。

在设计用户界面时,<a>标签通常是最合适的元素,但是<button>非常适合(实际上是有意)通过javascript执行操作。< / p>

  

使用<div>标签似乎是制作按钮(引导程序)的最常用方法,但我不确定原因。

我真的没有看到这方面的证据,说实话,他们所做的并不重要。引导框架倾向于忽略语义,例如,虽然仅仅出于诸如<li class="divider"></li>之类的表现原因使用空元素。

答案 1 :(得分:6)

从可用性的角度来看,由于浏览器处理交互性的方式,最好在<button><div>上实施<a>

如果您的用户是草率的答题器,他们错误地或在触摸屏上点击并拖动,他们最终可能会选择<div>内容而不是触发点击事件。使用<button>将大大减少此问题。

但是,在应用CSS时,非按钮对象(如<div>)可以更灵活。特别是在旧版浏览器中。