如何在没有表格的情况下设置样式和对齐表单? [英] How to style and align forms without tables?

查看:23
本文介绍了如何在没有表格的情况下设置样式和对齐表单?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已经习惯于使用

s 来完美地对齐我的表单字段.这就是我通常编写表单的方式:

<tr><td><label for="f_name">名字:</label></td><td><input type='text' id='f_name' name='f_name'/></td><td class='error'><?=form_error('f_name');?></td></tr>

我知道这是不好的做法,我想要使用 CSS、

s、或更清洁的方法.然而,事实是,s 非常适合表单.一切都完全正确对齐,间距是完美的,所有错误都在彼此之下,等等.

我最近尝试使用 <dt><dd> 标签作为表单,但我最终回到表格只是因为它们看起来好多了.

如何在不使用

s 的情况下获得这种对齐的表格布局?

解决方案

这可能不会得到很多支持,但这是我的两分钱:

在某些情况下,表格的布局更容易;例如三列或表单(尽管这里有一些关于纯 css 表单布局的很好的建议,所以也不要忽略它们.)

流程和方法可以成为好仆人,但不能成为好主人.- 马克·多德、约翰·麦克唐纳和贾斯汀·舒赫在软件安全评估的艺术"中

我相信这句话非常适用于这种情况.如果您的表格布局适合您,不会导致可访问性问题并且没有损坏 - 那就不要修复它.

诸如你应该"、必须"、总是"这样的短语——让我害怕,因为一种尺寸并不适合所有人!对狂热者持保留态度.

I've gotten used to using <table>s for aligning my form fields perfectly. This is how I commonly write my forms:

<table border="0">
   <tr>
     <td><label for="f_name">First name:</label></td>
     <td><input type='text' id='f_name' name='f_name' /></td>
     <td class='error'><?=form_error('f_name');?></td>
   </tr>
</table>

I know this is bad practice, and I want to use CSS, <label>s, <div>s, or a cleaner method. However, the fact is, <table>s work extremely well for the forms. Everything is aligned exactly right, the spacing is perfect, all errors exactly below each other, etc.

I recently tried using <dt> and <dd> tags for a form, but I ended up reverting back to tables just because they looked so much better.

How can I get this kind of aligned table layout without using <table>s?

解决方案

This might not get a lot of support but here's my two cents:

In some situations tables are easier for layout; such as three columns or forms (albeit there are some great suggestions here for doing a pure css form layout so don't ignore those either.)

Processes and methodologies can make good servants but are poor masters.
   - Mark Dowd, John McDonald & Justin Schuh 
     in "The Art of Software Security Assessment"

I believe that this quote very strongly applies to this situation. If your table layout is working for you, not causing accessibility issues and isn't broken - then don't fix it.

Phrases like: "you should", "must", "always" - make me scared, because one-size-doesn't-fit-all! Take zealots with a grain of salt.

这篇关于如何在没有表格的情况下设置样式和对齐表单?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆