Css rotate3d problem

https://codepen.io/justjump/p.

how to make this circle rotate on the plane?

Css
Sep.29,2021

Thank you for the invitation.

here you need to operate both axes at the same time. Pay attention to the order. Rotate X first, and then select Z

. 
.transformed {
    width:250px;height:250px;
    animation: spin 5s linear infinite;
}

@keyframes spin {
  from {
   transform:rotateX(75deg) rotateZ(0) ;
  }
  to {
   transform:rotateX(75deg) rotateZ(360deg) ;
  }
}

https://codepen.io/xboxyan/pe.

.transformed {
  -webkit-animation: spin 2s linear infinite;
        animation: spin 2s linear infinite;
}
 @-webkit-keyframes spin {
        0%   {
            -webkit-transform: rotate(0deg);
            -ms-transform: rotate(0deg);
            transform: rotate(0deg);
        }
        100% {
            -webkit-transform: rotate(360deg);
            -ms-transform: rotate(360deg);
            transform: rotate(360deg);
        }
    }
    @keyframes spin {
        0%   {
            -webkit-transform: rotate(0deg);
            -ms-transform: rotate(0deg);
            transform: rotate(0deg);
        }
        100% {
            -webkit-transform: rotate(360deg);
            -ms-transform: rotate(360deg);
            transform: rotate(360deg);
        }
    }

you can change the CSS of the original text to this 

.transformed {
  animation: spin 5s linear infinite;
}

@keyframes spin {
  50% {
   transform: rotateY(360deg);
  }
}

Previous: There seems to be a bug? in pyspider process management.

Next: How does react nest high-level components?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu