当前位置:  开发笔记 > 编程语言 > 正文

为什么使用HTML表单的定义列表(DL,DD,DT)标签而不是表格?

如何解决《为什么使用HTML表单的定义列表(DL,DD,DT)标签而不是表格?》经验,为你挑选了7个好方法。

我最近遇到过几个例子:

Full Name:
Email Address:

用于做HTML表单.这是为什么?使用表格有什么好处?



1> sjstrutt..:

我想由你来决定语义,但在我看来:

应使用与表单相关的属性,而不是定义列表.

您还可以使用

等标记将表单的各个部分聚集在一起,使用标记字段集.


您也可以将输入放在标签内
+1是唯一一个建议采用逻辑方式执行此操作的人.从布局的角度来看,"表格"通常在语义上不准确或非常灵活."定义列表"更接近但仍然有点延伸.但"输入"和"标签"?这正是事情的本质!
nickf:是的,但它更灵活,不嵌套它们,因为你就可以做标记{显示:块;}获得上述领域的标签或标签{明确:两者;浮动:左;宽度:300像素;}到看一下表格.
对于很多表单,我相信表/可能/在语义上是合适的.但并非在所有情况下.正如Chuck所说,从布局角度来看,表格不是很灵活.如果您要为表单使用表格,请确保它在语义上合适,并确保使用标签.

2> Hauge..:

我已经多次成功使用了本文中概述的技术.

我同意sjstrutt,你应该使用形式相关的标记一样label,并form在你的形式,但在他的例子中列出的HTML,经常会缺少一些代码,您可以为"挂钩"使用与CSS样式表单.

因此,我标记我的形式如下:

Form header

这种方法给我留下了一组易于理解的标签,其中包含足够的钩子,可以用很多不同的方式对表格进行样式化.


咦?如果你需要钩子,请使用div.这就是他们的目的.语义很棒(应该使用!)但是当你需要一个样式的锚时,最好使用没有语义含义的span或div.div是一个盒子,意思是这样使用.
我用这种方法找到的唯一问题是有时您需要将内容放在两个与两者无关的表单元素之间.在语义上,您应该关闭无序列表并重新开始,但是您可能只有一个包含一个子元素的列表.

3> Schwern..:

这是语义与格式问题的一个子集.定义列表说明它们是什么,相关键/值属性的列表,但没有说明如何显示它.表格详细介绍了布局以及如何显示数据,然后是内部数据.它限制了如何通过过度指定格式以及通过指定它是什么来格式化列表.

从历史上看,HTML将语义与格式混为一谈.字体标签和表格是最糟糕的例子.从格式化转移到CSS以及从XHTML中剥离许多纯格式化标签,有点意味着将意义与格式分离.通过将格式分成CSS,您可以以多种不同的方式显示相同的HTML,为广泛的浏览器,小型移动浏览器,打印,纯文本等重新格式化...

如需启发,请访问CSS Zen Garden.



4> Jeremy Ricke..:

在这种情况下,标签和输入您的语义含义,它们独立存在.

想象一下,你必须向盲人阅读网页.你不会说"好的,我这里有一个定义列表.第一个术语是'名字'." 相反,你可能会说"好吧,我们这里有一个表格,看起来有一组字段,第一个输入标记为 '名字'."

这就是语义网很重要的原因.它允许页面内容准确地代表人类和技术.例如,有许多 浏览器 插件可以帮助人们快速填写Web表单及其标准信息(姓名,电话号码等).如果输入没有相关标签,这些很难很好地工作.

希望有所帮助.



5> Bret..:

定义列表具有语义含义.它们用于列出术语(

)及其相关定义(
).因此,在这种情况下,
比表格更准确地描绘内容的语义含义.


正确使用的`input`和`label`标签已经明确无误,将它们包装在定义列表中至多是重言式.正如短语'语义':)
我不同意你的大卫,当一个表单有一个输入供你填写你的名字时,它会询问"你的名字是什么"所以"定义你的名字"是完全有效的,因此dt> firstname dd>你的输入.当然,定义有一个上下文,你.

6> ak...:

使用dl dt,dd表单只是另一种方式来构建你的表格,连同ul li,divtable.你可以随时label加入dt.这样就可以保持表单特定元素label的位置.


您的示例违反了规范,因为您的提交按钮属于密码dt.你有多个dd属于一个dt,这就是你在这里做的.我会完全将提交按钮放在dl下面,因为dl仅用于名称 - 值组 - 而不是像提交按钮一样独立的元素.
我认为这不符合规范.每个学期你可以拥有尽可能多的描述(反之亦然)http://www.w3.org/TR/html401/struct/lists.html#h-10.3但你是对的,应该移动提交按钮超出密码定义.

7> Andrew G. Jo..:

定义列表几乎从未使用过,因为从语义上讲,它们很少出现在Internet上。

您的情况下,正确的代码已发布:

您正在创建具有输入和用于所述输入的标签的表单,而不是列出单词列表并对其进行定义。

如果您正在执行某种帮助,则定义列表将是适当的,例如:

HTML
Hypertext Markup Language
CSS
Cascade Stylesheets
PHP
Hypertext Preprocessor

推荐阅读
可爱的天使keven_464
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有