CSS優化 技巧

1、-webkit-font-smoothing 字型鋸齒

div

2、css實現不換行、自動換行、強制換行

//不換行

white-space:nowrap;
//自動換行
word-wrap: break-word; 
word-break: normal; 
//強制換行
word-break:break-all;

3、使用css transforms 或者 animations時可能會有頁面閃爍的bug

-webkit-backface-visibility: hidden;

4、css開啟硬體加速

-webkit-backface-visibility: hidden;

-webkit-touch-callout: none;

6、清除手機tap事件後ele時候出現的乙個高亮

ele

7、user-select 禁止使用者選中文字

div

8、contenteditable設定element是否可編輯

可編輯

9、運動過程中，模糊問題

transform: translate3d(0, 0, 0);

10個精簡優化CSS檔案的技巧

可以使用 css optimizers 來優化css,但是我認為如果你使用下面提到的技巧編寫 時，效率和能力都會得到提高。優化css檔案還能節省流量同時提高頁面載入速度。1.注釋 編寫css時注釋顯得格外有用，這樣協同工作的同事就會理解 的含義。注釋方法有多種，你可以使用如下方法 comment 同...

CSS 陰影動畫優化技巧一則

本技巧來自這篇文章 how to animate box shadow with silky smooth performance 本文不是直譯，因為覺得這個技巧很有意思很有用，遂起一文。box shaodw在我們的工作中使用以及越來越多，伴隨陰影的動畫或多或少都有一點。假設，我們有下面這樣乙個盒子...

Google News優化技巧

google news以機器演算法自動聚合新聞內容而著名，儘管它還不完美。但可以肯定的是，無論你的新聞 是什麼型別，一旦被google news選為新聞源，那麼它將會給你的 帶去非常可觀的流量及新使用者。乙個很好的例子是ft.com在將部分內容免費及向google news開放後，半年內流量增長了7...