一直都是学习Aaron大叔，正美伯伯，鑫旭大舅。。。各种大神的博客文章。像渴望读书的孩子一样，一次又一次拜读各位大表哥留下的财富。

为了跟上大表哥们的脚步，今天我终于鼓起勇气悄悄的申请了一个博客园的账号，然后悄悄的发一些我自己的学习历程和笔记心得。

希望可以在未来的一天里也有个小伙子发同样的一篇博客来悄悄的记录对克劳伦斯大叔的无比崇拜（YYing...）

先来记个笔记，今天遇到的一个css方面的好东西：

第一个是：

将-webkit-font-smoothing设置为antialiased，变得非常平滑，效果非常不错。

-moz-osx-font-smoothing: grayscale;同上

代码为：

-webkit-font-smoothing: antialiased;

-moz-osx-font-smoothing: grayscale;

第二个：

/*这一句是用来解决在安卓上的点击出现篮框问题*/

body{ -webkit-tap-highlight-color:rgba(0,0,0,0); }

/*下面是解决ios上去除微信点击蓝色边框 */

a:focus,

input:focus,

p:focus,

div:focus{

-webkit-tap-highlight-color:rgba(0,0,0,0);

-webkit-user-modify:read-write-plaintext-only;

}

第三个：

虽然我们可能不想对元素应用3D变换，可我们一样可以开启3D引擎。例如我们可以用transform: translateZ(0); 来开启硬件加速 。

.cube {

-webkit-transform: translateZ(0);

-moz-transform: translateZ(0);

-ms-transform: translateZ(0);

-o-transform: translateZ(0);

transform: translateZ(0);

/* Other transform properties here */

}

在 Chrome and Safari中，当我们使用CSS transforms 或者 animations时可能会有页面闪烁的效果，下面的代码可以修复此情况：

.cube {

-webkit-backface-visibility: hidden;

-moz-backface-visibility: hidden;

-ms-backface-visibility: hidden;

backface-visibility: hidden;

-webkit-perspective: 1000;

-moz-perspective: 1000;

-ms-perspective: 1000;

perspective: 1000;

/* Other transform properties here */

}