html地球仪代码,HTML5 旋转的变色球（地球仪）

CSS

语言：

CSSSCSS

确定

* {

box-sizing: border-box;

font-size: 0px;

font-family: verdana;

}

.container {

top: calc(40vh - 200px);

font-size: 0px;

position: relative;

height: 200px;

width: 400px;

margin: 0 auto;

perspective: 1000px;

perspective-origin: 50% 100%;

transform-origin: 0 0;

transform-style: preserve-3d;

}

.circle {

position: absolute;

border: 4px solid #9c9cc9;

border-radius: 50%;

width: 400px;

height: 400px;

transform-style: preserve-3d;

transform: rotateY(45deg);

}

.text {

display: inline-block;

background: #9c9cc9;

margin: auto;

left: 0px;

right: 0px;

border-radius: 50%;

width: