相关标签

简单form标准化实例(一):整体布局

form 无论是在网站的制作中,还是在网站的重构中,我们都会频繁地“碰面”,当“碰面”的次数多了,反而觉得他更让人迷茫,有种熟悉的“陌生”,越来越把握不了他。 下面我们将带大家走进 form 的世界,一起来熟悉、探讨、掌握他的“脾性”。 对于简单 form 的设计图(如图,yahoo 注册页面的一部分),我们如何来做整体的布局呢?大体我们可以选用以下 3 种方式来做布局: 1、使用 table 来布局 这是大家最常用的方法,虽然现在到处都在谈标准化,甚至更多的在说 div+css ,但怿飞还是推荐使用 table 来布局 form。对于标准,个人的另类理解“更符合逻辑,更效率快捷”。 为什么推荐大家使用呢?table 本就是用来显示二维数据,用 table 来布局 form 可以说是他的“老本行”。另外重要的一点是,对于复杂的 form ,table 能更有效的进行布局和维... 2 条评论 »

checkbox的完美用户体验

最常见的 checkbox 的使用: <input type=”checkbox” name=”test” /> 点击这里没有任何效果 因为 checkbox 在高分辨率下,小方块会很小,很不容易点,这难免在用户体验上大打折扣。 下面看看我们的解决方法: 1、给 checkbox 配个 label “老婆”(老婆的特点:必要的): <input type=”checkbox” id=”test” name=”test” /><label for=”test”>点击这里就可以选中label</label> for属性功能:表示 lable 标签要绑定的 HTML 元素,点击这个标签的时候,所绑定的元素将获取焦点。 补充: 除以上方法,还可以直接用 label 套嵌整个表单组件和文本标签,如: <label><input type=”checkbox” />点击这里就可以选中label</label> 根据规范这样文本会自动与邻接的表单组件关联,但遗憾的是 IE 并不支持这个特性。 2、给 checkbox 配个 cursor:pointer “小蜜”(小蜜... 1 条评论 »