书写高效的CSS
这篇文章已经在草稿箱里放了好久，考虑一下还是发布吧。这是翻译的文章，原文在这里Efficiently Rendering CSS
我们写的CSS有多高效？换个说法，浏览器渲染我们的CSS会有多快？我承认这个问题我考虑的不够多
这个问题本应该是浏览器厂商考虑的——他们的浏览器越快，用户就越喜欢用他们的产品。Mozilla有一篇关于这方面最佳实践的文章，一直坚持Web应该更快的Google也有一篇。
我们一起看看他们阐释的一些主要观点，然后探讨一下这些原则的实用价值
从右向左
浏览器如何读取你的CSS选择器？我们需要明白的最重要的一点是从右向左。比如这个选择器ul > li a[title="home"]，浏览器首先读取的是a[title="home"]。这个首先被读取的部分我们叫它key selector，它是浏览器最終要选择的元素。
ID最快，Universal最慢
有四种类型的key selector，解析速度由快到慢依次是：ID、class、tag和universal
用jQuery和CSS3给图片添加圆角
你可能已经注意到我博客上的图片是带有圆角的，以免你没看过，先来张照片看看吧，这似乎真的是我第一次拍照片。
这可是用我们纳税人的血汗钱堆出来的灯火辉煌又毫无实际用途的外滩啊，有这些钱我能买多少MBP，买多少法拉利、兰博基尼啊TAT 看来我也不是什么好东西。。。
震精了！CSS竟然可以这样
不得不承认，我奥特曼了，似乎一直没怎么学习新的东西，我现在会的都还是上学那会随便看的一点点。我已经很久很久没真的学点东西了！！！我的Linux都一个多月没更新了！
CSS等级进度条
现在的网站论坛一般都会有用户等级这一说，如果单纯的只是用文字或一个等级图片似乎不够形象。要为网站论坛的用户等级作一个形象的展示，弄这么一个进度条则能很好的说明问题
记得在一些论坛上见过这种类似的，但是当想要找的时候又不知道应该到哪去找，也不知道这东西应该用什么名字。不要看这么个小东西，从头实现起来还是费了点时间，虽然到最后一看結果不过如此。。。下面是简单的实现方法
def user_level_bar(user) <<-EOF <div class="fullscore"> <div class="score" style="width:#{user_level_length(user)}px;"></div> <div class="img"> #{user_level_text(user)} </div> </div> EOF end
这是个rails的helper，虽然主要是说CSS，但是这进度总规是动态的吧。。。
历经千辛终于用上了自己的主题
话说ABitNo几天前一时来了兴致学起了CSS，然后就想找点东西做了练下手，就制作了这么一个超级简洁型的主题，虽然简洁，但个人感觉很有质感，正是我最喜欢的类型（或许是自恋吧）。大家帮忙测试下了，先谢谢大家！避免在不同的浏览器上出现无法预料的后果，我就自己做了个截图放在这里
用CSS做个柱形图
一时来了兴致，也想学习下CSS了，把《Head First HTML & CSS & XHTML》看了一遍，才发现写网页也是这么有乐趣，比写后台代码爽多了。在Meyer的网页上看到可以用CSS来画图表，真是太神奇了（或许对那些有经验的人来说不神奇，可ABitNo是刚开始学习的）。先看看效果图
你能不被被这效果给征服吗？我们一起来看看实现传奇的代码吧