How to reset CSS3 *-transform: translate(…)?

前端 未结 2 2008
心在旅途
心在旅途 2020-12-13 08:40

How can I reset CSS transform properties CSS translate value?

Say I have:

div.somec         


        
相关标签:
2条回答
  • 2020-12-13 09:05

    Safari iOS 10.3, 11.0 and Safari 11 on macOS didn't actually reset the transformation properly with -webkit-transform: none; or transform: none; I had to instead reset all the values I changed with the transform property so essentially I think the first option

    translate(0, 0); / translate3d(0, 0, 0);
    

    is the way to go for browser compatibility for now. So this SHOULD work:

    -webkit-transform: translate(0, 0) translate3d(0, 0, 0);
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: translate(0, 0) translate3d(0, 0, 0);
    
    0 讨论(0)
  • 2020-12-13 09:09

    As per the MDN documentation, the Initial value is none.

    You can reset the transformation using:

    div.someclass {
        transform: none;
    }
    

    Using vendor prefix:

    div.someclass {
        -webkit-transform: none; /* Safari and Chrome */
           -moz-transform: none; /* Firefox */
            -ms-transform: none; /* IE 9 */
             -o-transform: none; /* Opera */
                transform: none;
    }
    
    0 讨论(0)
提交回复
热议问题