html 地球页面代码,纯CSS3实现地球自转实现代码(图文教程附送源码)

最终成果：

素材：两张图片,

espaco.jpg(1600*1000)

terra.jpg(900*450)

第一步，形成静态图(地球背景全屏，地球大小为450px*450px，地球位置为上下左右居中)：

复制代码代码如下:

Planet Earth

body{

background: url(espaco.jpg) no-repeat 0 0;

background-size: 100%; /* 背景图片被拉伸为全屏 */

}

.earth{

background: url(terra.jpg) repeat-x 0 0; /* 背景图片在水平方向复制*/

/*下面的属性可使地球位于浏览器窗口垂直水平居中国*/

height