首先谈一个平时经常碰到的问题：元素水平垂直居中。当然如果之前做过类似的效果，你可以很快的从以前的代码里复制过来。
若是你从未碰到过此问题，并且非得用纯CSS来实现，我想你一时半了也是束手无策吧。这里不讨论如何实现的细节，网上关于此问题的解决方法也是层出不穷，但都有共同点：复杂，取巧。
且不论纯CSS的实现是否有意义，光是其CSS的代码就违背的HTML的思想：用简单的方法实现复杂的效果。这里的简单不仅仅是指代码上的简短，更重要的是体现一种容易实现的解决方案。显然，先前提到的方案里，用纯CSS是最不容易实现的。当然，你已有现成的例子或许更加简单，但更多的时候面对的是一些从未经历过的问题，如果非得用纯XXX实现的话，岂不是事倍功半。事实上，HTML里包含的每个特征都是为了简化开发者的工作量而设计的。CSS，JS，Flash。。。以至于未来的HTML5，新的特征不仅仅是为了丰富内容，更多的是为了简化原先的实现！
仍旧是垂直居中的问题，我们抛弃纯CSS，用JS辅助CSS实现，会发现总体代码并没有增加多少；相反，每条每句都是那么容易的理解，完全可以抛弃那一堆hack，以及一些晦涩的，没有注释根本没法琢磨的CSS代码。最终呈现在用户眼里的都是一样的效果，又何不选择一条实现简单容易的方法，而要走崎岖不平的山路呢？
有些人认为纯XXX的实现是一种水平的体现，我认为是完全错误的观点。你用纯css制作了各种各样的特效，说明这方面积累的比较多，你需要了解每个浏览器的怪异特征，并逐一测试，还需不时的关心浏览器升级过后这些特征是否发生了变化。然而，配合利用JS来实现，其解决方法就要简单明了的多。
且不论渲染效率谁快谁慢，光是开发效率后者要高的多，即便是渲染要慢些，那也仅仅是忽略不计的那一丁点（事实上是不会比纯CSS的慢）。此前也常常在网上看见不少人发帖提问，XXX效果用纯CSS怎么实现。大家于是开始琢磨，但不是这个浏览器有问题，就是那个浏览器不兼容。最后终于出现正确答案，一大堆乱七八糟的CSS，甚至还加了无用的元素，仅仅是为了影响周围一些变化。大家看了也是一知半解，但测试了下的确可以，于是纷纷发帖佩服，表示高深，很强大。
然而，回过头仔细想想，把各种浏览器的怪异现象利用的淋漓尽致，究竟是一种高明呢，还是一种退步?在过去，IE独占天下的时候，WEB的开发时一件很轻快的事，因为即使我们不按标准去做，但只要IE里运行正常就可以了。那个时候应该有不少和我一样，连document.getElementById这样基础的东西都不知道，因为IE里不需要。与其说是WEB开发，不如说是IE开发。然而，随着各种浏览器的不断冒出，WEB开发已不再像过去那样轻快了，相反是件头疼的事，我们需要花大量的时间在与内容毫不相干的事上，甚至连总结差异也成了WEB开发的一部分。每个浏览器虽然大致相同，但细节方面却各有所异。过去IE的页面在其他浏览器里或许变得支离破碎，原因也很简单，无非两个：1.我们本来就没有按照标准去做，2.其他的浏览器没有严格按标准去实现。
说到底，WEB的最终释义无非就是“标准” 二字。若是所有的的浏览器都遵循标准，所有的开发者也都按照标准开发，那么就能实现“一次开发，到处浏览”。虽然后者可以做到，但是前者是几乎是不可能的，至少在近几年里。更何况如今为了制作与众不同的效果，几乎是挖遍了每个浏览器私有的特效，这对WEB一统就更困难了。正因为出现了如此的局面，也成就了如今大红大紫的Flash，以至于越来越强大。因为它的确是做到了“一次编译，到处运行”的理念。
用最简单的办法，让各个浏览器表现出一致的布局特性，无疑就是用绝对定位。曾有人说过，用绝对定位做网页的不是最菜的就是最高的。新手不了解CSS复杂的布局特征，于是把所有的都变成了绝对定位，方便在编辑器里拖来拖去，想放哪就放哪。当然这样出来的HTML是极度臃肿的，灵活性也是相当的差，但是惟独有一个优点：所有的浏览器里都是一致的布局。随着新手慢慢成长，也开始熟悉使用CSS主流的布局，以至到了跨浏览器里测试的那天，才发现要兼容所有的浏览器是何等的麻烦。然而绝对定位也是最高端的，因为它配合脚本可以实现丰富的效果，Google的个性化首页，QQ空间的可拖动项目栏。。。越来越多的创意布局展现出来，无不用到了绝对定位。我也曾经考虑过，通过脚本让整个网站都是由绝对定位元素构成，这样显然是可以大量减少累赘的布局代码，服务器仅需提供脚本文件和内容数据，让客户端自己来生成，甚至是一个门户网站。当然，这个想法似乎是夸张到了极点。
不过即便是用经典的DIV/CSS做网页，也不代表绝对定位的不可行。对于局部的一些效果，用了绝对定位就会比纯CSS实现的简单多了，兼容性也更好了，就是用到了脚本，但这算是一个不完美吗？为何非得为了一个纯理念而在一棵树上吊死呢？ HTML的本质就是：最简单的方法实现它。(2011/3/13)
| 
发表于 2011-3-13 22:38:15
