The Backface-visibility property defines whether the element is visible when it is not facing the screen.
This property is useful if the rotation element does not want to see its back.
Backface-visibility:visible|hidden;
The following example effect:
The contrast between visible and hidden
< Div > < class= "Box1"> I am the front </div> < class= "Box2"> I am the reverse </div> </div>
. Box1{width:300px;Height:300px;background:RGB (196,.);Border-radius:50%;text-align:Center;Line-height:300px;font-size:40px;position:relative;Z-index:1;Animation:turn 2s infinite;backface-visibility:Hidden; }. Box2{width:300px;Height:300px;background:RGB (231, +/-);Border-radius:50%;text-align:Center;Line-height:300px;font-size:40px;position:Absolute; Left:0;Top:0; }@keyframes Turn{from{Transform:Rotatey (0deg); } to{Transform:Rotatey (360deg); } }
CSS3 backface-visibility not facing the screen is visible