2021-06-20

1、首先我们在DW里创建一个新的HTML，然后在body标签里面创建一个div。

 

 

2、接着在style标签里设置body的高度为500px，背景颜色为黑色。

 

 

 

 

3、然后我们就给div设置宽度、高度、外边距以及边框。

 

 

我们去网页查看一下效果！

 

 

 

 

 

 

 

 

4、接着就来设置背景颜色和动画（background-size:规定背景的尺寸可通过百分比，或像素去实现；repeating-linear-gradient()重复线性渐变；radial-gradient():径向渐变；linear-gradient():线性渐变；animation-name:名称 :(调用动画名称)；animation-duration (动画播放时间)；animation-iteration-count （动画播放次数） ）

 

 

去看一下效果！

 

 

 

 

5、之后我们再去设置animation的每个阶段background-position的值。（0%=left，30%=right，60%=left，100%=right。）

 

 

我们再看一下效果。

 

 

 

 

 

 

 

 

 

 

 

 

 

6、最后再给div设置一个伪类。

 

 

当我们打开网页的时候，中间框里的颜色一直在变化，当我们把鼠标移动到框里时，框内的颜色就会停下来，当我们把鼠标移开时，颜色又开始变了起来！

，

 

目录

1、首先我们在DW里创建一个新的HTML，然后在body标签里面创建一个div。

 

 

---

 

以上就是我的分享！请多多指教！