文章詳情頁
css3 transform 奇葩問題 ?
瀏覽:79日期:2023-06-29 08:57:40
問題描述
下面這段代碼為什么在androud手機上有些瀏覽器下(包括微信)(所有.digit-col)的元素移動的距離卻不一樣!有多有少,甚是奇葩!$('.digit-col').each(function(index, el) { $(el).attr('style','-webkit-transform: translate(0,20px);transform: translate(0,20px)');});
問題解答
回答1:因為設定的距離是px,不同機型的分辨率不同。單位像素大小也就不同。如果你換成百分比應該會解決
回答2:手機分辨率的問題
回答3:你看看移動端rem單位的使用,就能在不同手機上效果一樣了
回答4:感謝各位的回復,問題已經解決,因為的p的背景圖片只設置了寬度,沒有設置高度的原因!這里還有疑點-》所有的p都是一樣的寬度,一樣的高度,背景圖片只設寬度,不設高度,為何不行?
導致數字轉動后停的位置不一樣(視覺上不一樣),其實transform是一樣的!
標簽:
CSS
相關文章:
1. html - vue項目中用到了elementUI問題2. mysql scripts提示 /usr/bin/perl: bad interpreter3. showpassword里的this 是什么意思?代表哪個元素4. css3 - border-bottom 的長度可否超過盒子的寬度呢?實現如下圖效果。(我的書下面的線)5. javascript - windows下如何使用babel,遇到了困惑6. 對mysql某個字段監控的功能7. css3 - css怎么實現圖片環繞的效果8. javascript - 原生canvas中如何獲取到觸摸事件的canvas內坐標?9. JavaScript事件10. mysql優化 - mysql EXPLAIN之后怎么看結果進行優化 ?
排行榜
