笔记：css 实现玻璃磨砂效果
.test{ -webkit-filter: blur(3px); -moz-filter: blur(3px); -ms-filter: blur(3px); -o-filter: blur(3px); filter: blur(3px); } 很简单，只要给个 filter: blur(3px); 就可以了，其中里面的数值是玻璃模糊程度
对于 -webkit-backface-visibility: hidden 这样的样式你需要知道的，在chrome和safari里会导致某些别的浮动在此上面的div的 overflow:hidden 失效
-webkit-backface-visibility:hidden 这个CSS3可以在CSS3动画时解决闪烁的问题，但是你或许不知道，加上这个样式后可能会让你在某些时候遇到奇葩的问题。 我今天就因为这个样式让我纠结了半天，同样的CSS代码在别处可以，在这边就会出现overflow:hidden失效的问题，但是始终找不到问题所在，最后使用替换、一部分一部分大面积的删除代码的办法找到了问题所在。。。 然后我把CSS代码进行提炼，做了一个demo出来，链接 ： http://jsfiddle.net/jonwang/q9LaB/5/ 注意，用chrome或safari打开，我的浏览器版本是28.0 […]
Emmet LiveStyle – 适合前端攻城狮使用的实时在线调试CSS的工具，怎么好用？看了官方视频你肯定会心动
二话不说，先看 Emmet LiveStyle 官方视频： 顺便吐槽下万恶的TC网络，为了下载官方被河蟹的视频，我搞了1个小时才把视频拉下来 官方网站地址 http://livestyle.emmet.io/ 这边稍微介绍下安装方法： 首先，你需要使用 Sublime ，这个编辑器是一款非常强悍的编辑器，在编辑器里装上LiveStyle的扩展，安装方法： 按ctrl+shift+p，然后输入controll后选择Install Package，再在弹出的对话框里输出 LiveStyle 确定后即开始安装了，骚等几秒钟即可安装好，若再不会请google。 然后，给浏览器装上插件，Chrome直接 […]
挖出来的好东西，Glyphicons Pro Icons 字体图标打包提供下载了，含ttf, woff, eof, svg格式，是矢量的哦
Glyphicons (http://glyphicons.com/) 图标是一个非常好的图标组合。 本图标可以直接替换掉 bootstrap 的icon，详情查看 http://twitter.github.io/bootstrap/base-css.html#icons 也可与著名的 Font-Awesome 配合使用 DEMO在线演示 https://www.queyang.com/demo/glyphicons/ 打包下载 https://www.queyang.com/demo/glyphicons/glyphicons.zip 使用方法： HEAD里加入CSS <link h […]
当 test-overflow: ellipsis 遇到 button
超出宽度的文字自动加省略号…的css很简单，但是如果在button上使用这个要注意了，在chrome26及以下不支持，升级到27后可以 .overflow { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width:50px; display:inline-block; } <button class="overflow">测试文字测试文字</button> < […]