码迷,mamicode.com
首页 > Web开发 > 详细

用CSS3把列表项目反转显示

时间:2014-05-09 04:36:29      阅读:388      评论:0      收藏:0      [点我收藏+]

标签:style   tar   color   http   width   get   

忘了哪儿的一个题目来着,说是把 一个列表 给翻转序列显示,比如 :

有一个列表如图: bubuko.com,布布扣翻转为 bubuko.com,布布扣

回复里面有人机智的使用 CSS3 的 transform:rotate(180deg); 实现了,引发众人赞叹。 

其实除了这种方法,还有其他的CSS3属性可以做到。今天在看 张鑫旭的这篇文章 的时候 发现 box-direction:reverse;  这个属性就很适合

废话不说 直接上 DEMO  细心的人可以比对出两种方案效果的差别。

用Chrome 打开,只对Chrome写了前缀。PS: 编写DEMO的时候  利用 pre style, pre script{ display:block;} 再加以格式化 真是好便捷~

结论:CSS3很强大,好多属性可以挖掘,赞别人的解决方案之余别禁锢了自己尝试解决问题的能力。

用CSS3把列表项目反转显示,布布扣,bubuko.com

用CSS3把列表项目反转显示

标签:style   tar   color   http   width   get   

原文地址:http://www.cnblogs.com/trance/p/3716087.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!