有很多css屬性可以影響元素定位，比如float,margin,padding,position,translate()。表面上來看，position:relatative和transform:translate()似乎作用一致，但其實他們之間也有幾個差別，本篇文章就將比較這兩個屬性。
1.瀏覽器支援情況
position是css2的屬性，transform是css3的屬性，在ie8及以下的瀏覽器是不支援2d transform的。
2.gpu加速
transform屬性可以使用硬體加速，這就使得當元素變換或者動畫時，translate()效能表現要優於position的。
關於硬體加速原理，可以看我之前的總結文章
3.百分數的基準不同
當屬性值是百分數時，translatex和translatey分別以自身寬高為標準，而當應用position時，left/top中的百分數是以最近定位父元素的寬高為標準的。
當我們未知寬高元素水平垂直居中時，我們可以使用決定定位加translate(-50%,-50%)。
replace 和TRANSLATE 函式的對比
translate string,from str,to str 返回將 所有出現的 from str中的每個字元替換為to str中的相應字元以後的string。translate 是 replace 所提供的功能的乙個超集。如果 from str 比 to str 長，那麼在 from str ...
translate和replace 的區別
1.translate 語法 translate char,from,to 用法 返回將出現在from中的每個字元替換為to中的相應字元以後的字串。若from比to字串長，那麼在from中比to中多出的字元將會被刪除。三個引數中有乙個是空，返回值也將是空值。舉例 sql select transla...
translate函式的使用
translate string,from str,to str 執行時,translate依次檢查string中的每個字元 然後查詢這個字元是否在from str中存在 如果不存在，那麼這個string中的字元被保留，也就是被返回，如果存在，那麼，translate會記下這個字元在from str...