想问一下下面这段CSS3代码是什么意思，求大神解释一下~

html-css018

想问一下下面这段CSS3代码是什么意思，求大神解释一下~,第1张

radial-gradient：径向渐变。

这个是css3的一个属性。不过一般的用法并不是上面这样写的

<div style="background:radial-gradient(red,green)"></div>

这个就可以写出一个中心是红色的球形，外圈是绿色的渐变方块儿。

还用另外的方法，就是at属性

<div style="background:radial-gradient(at 35px 35px,red,green)"></div>

这样的写法就可以做到从左上角像右下角延伸X和Y坐标都为35px为中心的一个渐变块儿。你可以设置一下宽高，然后自行体会就好了

<div class="radius"></div>

.radius {

width: 100px

height: 100px

border-radius:50%

background: red

-webkit-animation: float ease-in-out 2s infinite

animation: float ease-in-out 2s infinite

}

@-webkit-keyframes float {

0% {

-webkit-transform: translateY(0)

transform: translateY(0)

}

50% {

-webkit-transform: translateY(20px)

transform: translateY(20px)

}

100% {

-webkit-transform: translateY(0)

transform: translateY(0)

}

}

@keyframes float {

0% {

-webkit-transform: translateY(0)

transform: translateY(0)

}

50% {

-webkit-transform: translateY(20px)

transform: translateY(20px)

}

100% {

-webkit-transform: translateY(0)

transform: translateY(0)

}

}

想多大只要改变20px

如果左右把y轴改为x轴

您好，可以先画一个有立体感的球体，或者直接网上找个图片，然后给这个球体添加动画，选择强调里的陀螺旋，在效果选项里将重复次数自行设定，就可以实现让球体在地上滚动的效果。同时还可借助在图片上覆盖诸如半透明灰色和半透明白色的圆形形状来实现球体高光的视觉错觉，让滚动显得更加真实。当然，如果像前面的人所说的地球自转，我没想到实现办法。不过说回来，PPT本身只是个平面软件，所以只能靠一系列平面的视觉错觉来营造一种立体感。