耽美苍明广播剧《你是我情缘》代码开源

莫子祁

晋江原帖链接 http://bbs.jjwxc.net/showmsg.php?board=52&id=79971
HTML代码部分

1. <center>
   
2. <link rel="stylesheet" href="http://www.chinadra.com/ziqi/Gbj_css/nswqy.css" type="text/css" media="all" />
   
3. <table id="gbj_table1">
   
4. <tr>
   
5. <td id="gbj_background">
   
6. <ul id="gbj_staff">
   
7. <h3>Staff：</h3>
   
8. <li>策划&美工：蛋花【天禄客栈】/</li><li>
   
9. 编剧：慕杉【深夜工作室】/</li><li>
   
10. 导演：砚痕【无期之约】/</li><li>
    
11. 后期：半夏尘鞅【醉美倾晴阁】/</li><li>
    
12. 宣传：Corta_子祁【这个工作室】/</li>
    
13. </ul><ul id="gbj_cast">
    
14. <h3>Cast：</h3>
    
15. <li>/陆遥：疯子【流连声色】</li><li>
    
16. /薛皑：未眠【天禄客栈】</li><li>
    
17. /燕苍离：王严肃【未来之声】</li><li>
    
18. /陆月明：道长【魅素漪工作室】</li><li>
    
19. /师弟&幼年陆遥&少年路月明：龙咩【语翼配音组】</li><li>
    
20. /师姐&师妹：泠酒花萝：郁望梦始【第二人格工作室】</li><li>
    
21. /卡卢比：洛木</li>
    
22. </ul>
    
23. </td>
    
24. </tr>
    
25. </table>
    
26. <li id="href_chinadra"><a href="https://www.bilibili.com/video/av21365755?from=search&seid=15375262520225154555"  target="_blank"><font class="link_color">Chinadra</font></a></li>
    
27. <li id="href_missevan"><a href="http://www.missevan.com/sound/player?id=906530"  target="_blank"><font class="link_color">Missevan</font></a></li>
    
28. <li id="href_bilibili"><a href="https://www.bilibili.com/video/av21365755?from=search&seid=15375262520225154555"  target="_blank"><font class="link_color">BiliBili</font></a></li>
    
29. <li id="href_baidudisk"><a href="https://pan.baidu.com/s/1hWvIZukz80HhN0IDfRz0cQ"  target="_blank"><font class="link_color">剧包下载</font></a></li>
    
30. </table>
    
31. </center>
    
32. <img src="http://www.chinadra.com/ziqi/Gbj_photo/MyLove/cangyun.png" id="img_cy"/>
    
33. <img src="http://www.chinadra.com/ziqi/Gbj_photo/MyLove/mingjiao.png" id="img_mj"/>
    
34. <center><font class="gbj_sh">-----声明-----<br>
    
35. 本作品中采用的音乐、音效等素材均来自于互联网，著作权归原作者或发行公司所有。<br>
    
36. 本作品仅供配音爱好者个人学习、交流，请勿进行二次修改或者用于任何商业用途。<br>
    
37. 本作品开放转载，转载时请注明出处。</font></center>

复制代码

CSS部分

1. @charset "utf-8";
   
2. /* CSS Document */
   
3. body {
   
4.         background-color: #e8f3ffe0;
   
5. }
   
6. #gbj_background {
   
7.         background-image: url(http://www.chinadra.com/ziqi/Gbj_photo/MyLove/background.png);
   
8. }
   
9. #gbj_staff, #gbj_cast {
   
10.         list-style: none;
    
11.         position: relative;
    
12.         z-index: 12;
    
13.         color: #FFF;
    
14.         width: 300px;
    
15.         opacity: 0;
    
16. }
    
17. #gbj_cast {
    
18.         top: -210px;
    
19.         text-align: left;
    
20.         left: 540px;
    
21. }
    
22. #gbj_staff {
    
23.         top: 260px;
    
24.         text-align: right;
    
25.         left: 560px;
    
26. }
    
27. #gbj_table1 {
    
28.         width: 1008px;
    
29.         height: 634px;
    
30.         opacity: 0;
    
31.         position: relative;
    
32.         z-index: 10;
    
33.         left: -120px;
    
34.         border: groove;
    
35. }
    
36. #img_cy, #img_mj {
    
37.         position: absolute;
    
38.         top: 300px;
    
39.         left: 35%;
    
40.         z-index: 8;
    
41.         opacity: 0;
    
42. }
    
43. #href_bilibili, #href_missevan, #href_baidudisk, #href_chinadra {
    
44.         list-style: none;
    
45.         border-radius: 50%;
    
46.         background-color: rgba(255,255,255,0.6);
    
47.         position: relative;
    
48.         top: -330px;
    
49.         z-index: 12;
    
50.         margin-bottom: -35px;
    
51.         opacity: 0;
    
52. }
    
53. #href_chinadra {
    
54.         right: 300px;
    
55.         width: 100px;
    
56.         height: 100px;
    
57.         line-height: 100px;
    
58.         font-size: 17px;
    
59.         border-style: inset;
    
60. }
    
61. #href_missevan {
    
62.         right: 110px;
    
63.         width: 90px;
    
64.         height: 90px;
    
65.         line-height: 90px;
    
66.         font-size: 15px;
    
67.         border-style: outset;
    
68. }
    
69. #href_bilibili {
    
70.         right: 410px;
    
71.         width: 80px;
    
72.         height: 80px;
    
73.         line-height: 80px;
    
74.         font-size: 15px;
    
75.         border-style: outset;
    
76. }
    
77. #href_baidudisk {
    
78.         right: 220px;
    
79.         width: 130px;
    
80.         height: 130px;
    
81.         line-height: 130px;
    
82.         font-size: 22px;
    
83.         border-style: inset;
    
84. }
    
85. li a:hover, li a:link, li a:active, li a:visited {
    
86.         text-decoration: none;
    
87. }
    
88. .link_color {
    
89.         color: #F00;
    
90. }
    
91. .gbj_sh {
    
92.         position: relative;
    
93.         top: -100px;
    
94. }
    
95. @media screen and (min-width: 1200px) {
    
96. #img_cy, #img_mj {
    
97.         left: 40%;
    
98. }
    
99. }
    
100. /*绑定动画阶段css*/
     
101. #img_cy {
     
102.         animation: cangyun 3s linear 0s 1;
     
103.         -moz-animation: cangyun 3s linear 0s 1;        /* Firefox */
     
104.         -webkit-animation: cangyun 3s linear 0s 1;        /* Safari 和 Chrome */
     
105.         -o-animation: cangyun 3s linear 0s 1;        /* Opera */
     
106. }
     
107. #img_mj {
     
108.         animation: mingjiao 3.5s linear 2.9s 1;
     
109.         -moz-animation: mingjiao 3.5s linear 2.9s 1;        /* Firefox */
     
110.         -webkit-animation: mingjiao 3.5s linear 2.9s 1;        /* Safari 和 Chrome */
     
111.         -o-animation: mingjiao 3.5s linear 2.9s 1;        /* Opera */
     
112. }
     
113. #gbj_table1 {
     
114.         animation: table1 3s linear 6.5s 1 forwards;
     
115.         -moz-animation: table1 3s linear 6.5s 1 forwards;        /* Firefox */
     
116.         -webkit-animation: table1 3s linear 6.5s 1 forwards;        /* Safari 和 Chrome */
     
117.         -o-animation: table1 3s linear 6.5s 1 forwards;        /* Opera */
     
118. }
     
119. #gbj_staff {
     
120.         animation: staff 2s linear 8.5s 1 forwards;
     
121.         -moz-animation: staff 2s linear 8.5s 1 forwards;        /* Firefox */
     
122.         -webkit-animation: staff 2s linear 8.5s 1 forwards;        /* Safari 和 Chrome */
     
123.         -o-animation: staff 2s linear 8.5s 1 forwards;        /* Opera */
     
124. }
     
125. #gbj_cast {
     
126.         animation: cast 2s linear 8.5s 1 forwards;
     
127.         -moz-animation: cast 2s linear 8.5s 1 forwards;        /* Firefox */
     
128.         -webkit-animation: cast 2s linear 8.5s 1 forwards;        /* Safari 和 Chrome */
     
129.         -o-animation: cast 2s linear 8.5s 1 forwards;        /* Opera */
     
130. }
     
131. #href_chinadra {
     
132.         animation: chinadra 2s linear 9s 1 forwards;
     
133.         -moz-animation: chinadra 2s linear 9s 1 forwards;        /* Firefox */
     
134.         -webkit-animation: chinadra 2s linear 9s 1 forwards;        /* Safari 和 Chrome */
     
135.         -o-animation: chinadra 2s linear 9s 1 forwards;        /* Opera */
     
136. }
     
137. #href_missevan {
     
138.         animation: missevan 2s linear 9.4s 1 forwards;
     
139.         -moz-animation: missevan 2s linear 9.4s 1 forwards;        /* Firefox */
     
140.         -webkit-animation: missevan 2s linear 9.4s 1 forwards;        /* Safari 和 Chrome */
     
141.         -o-animation: missevan 2s linear 9.4s 1 forwards;        /* Opera */
     
142. }
     
143. #href_bilibili {
     
144.         animation: bilibili 2s linear 9.9s 1 forwards;
     
145.         -moz-animation: bilibili 2s linear 9.9s 1 forwards;        /* Firefox */
     
146.         -webkit-animation: bilibili 2s linear 9.9s 1 forwards;        /* Safari 和 Chrome */
     
147.         -o-animation: bilibili 2s linear 9.9s 1 forwards;        /* Opera */
     
148. }
     
149. #href_baidudisk {
     
150.         animation: baidudisk 2s linear 10.2s 1 forwards;
     
151.         -moz-animation: baidudisk 2s linear 10.2s 1 forwards;        /* Firefox */
     
152.         -webkit-animation: baidudisk 2s linear 10.2s 1 forwards;        /* Safari 和 Chrome */
     
153.         -o-animation: baidudisk 2s linear 10.2s 1 forwards;        /* Opera */
     
154. }
     
155. .link_color {
     
156.         animation: linkcolor 8s linear 9.2s infinite alternate forwards;
     
157.         -moz-animation: linkcolor 8s linear 9.2s infinite alternate forwards;        /* Firefox */
     
158.         -webkit-animation: linkcolor 8s linear 9.2s infinite alternate forwards;        /* Safari 和 Chrome */
     
159.         -o-animation: linkcolor 8s linear 9.2s infinite alternate forwards;        /* Opera */
     
160. }
     
161. .gbj_sm {
     
162.         position: relative;
     
163.         top: -150px;
     
164. }
     
165. /*动画执行阶段*/
     
166. /*苍云logo*/
     
167. @keyframes cangyun {
     
168. 0% {
     
169. transform:rotateY(0deg);
     
170. opacity:0;
     
171. }
     
172. 25% {
     
173. transform:rotateY(45deg);
     
174. opacity:1;
     
175. }
     
176. 50% {
     
177. transform:rotateY(90deg);
     
178. opacity:1;
     
179. }
     
180. 75% {
     
181. transform:rotateY(135deg);
     
182. opacity:1;
     
183. }
     
184. 95% {
     
185. transform:rotateY(180deg);
     
186. opacity:0.2;
     
187. }
     
188. 100% {
     
189. transform:rotateY(195deg);
     
190. opacity:0;
     
191. }
     
192. }
     
193. @-moz-keyframes cangyun /* Firefox */ {
     
194. 0% {
     
195. transform:rotateY(0deg);
     
196. opacity:0;
     
197. }
     
198. 25% {
     
199. transform:rotateY(45deg);
     
200. opacity:1;
     
201. }
     
202. 50% {
     
203. transform:rotateY(90deg);
     
204. opacity:1;
     
205. }
     
206. 75% {
     
207. transform:rotateY(135deg);
     
208. opacity:1;
     
209. }
     
210. 95% {
     
211. transform:rotateY(180deg);
     
212. opacity:0.2;
     
213. }
     
214. 100% {
     
215. transform:rotateY(195deg);
     
216. opacity:0;
     
217. }
     
218. }
     
219. @-webkit-keyframes cangyun /* Safari 和 Chrome */ {
     
220. 0% {
     
221. transform:rotateY(0deg);
     
222. opacity:0;
     
223. }
     
224. 25% {
     
225. transform:rotateY(45deg);
     
226. opacity:1;
     
227. }
     
228. 50% {
     
229. transform:rotateY(90deg);
     
230. opacity:1;
     
231. }
     
232. 75% {
     
233. transform:rotateY(135deg);
     
234. opacity:1;
     
235. }
     
236. 95% {
     
237. transform:rotateY(180deg);
     
238. opacity:0.2;
     
239. }
     
240. 100% {
     
241. transform:rotateY(195deg);
     
242. opacity:0;
     
243. }
     
244. }
     
245. @-o-keyframes cangyun /* Opera */ {
     
246. 0% {
     
247. transform:rotateY(0deg);
     
248. opacity:0;
     
249. }
     
250. 25% {
     
251. transform:rotateY(45deg);
     
252. opacity:1;
     
253. }
     
254. 50% {
     
255. transform:rotateY(90deg);
     
256. opacity:1;
     
257. }
     
258. 75% {
     
259. transform:rotateY(135deg);
     
260. opacity:1;
     
261. }
     
262. 95% {
     
263. transform:rotateY(180deg);
     
264. opacity:0.2;
     
265. }
     
266. 100% {
     
267. transform:rotateY(195deg);
     
268. opacity:0;
     
269. }
     
270. }
     
271. /*明教logo*/
     
272. @keyframes mingjiao {
     
273. 0% {
     
274. transform:rotateY(180deg);
     
275. opacity:0;
     
276. }
     
277. 25% {
     
278. transform:rotateY(135deg);
     
279. opacity:0.3;
     
280. }
     
281. 50% {
     
282. transform:rotateY(90deg);
     
283. opacity:0.6;
     
284. }
     
285. 75% {
     
286. transform:rotateY(45deg);
     
287. opacity:1;
     
288. }
     
289. 100% {
     
290. transform:rotateY(0deg);
     
291. opacity:0;
     
292. }
     
293. }
     
294. @-moz-keyframes mingjiao /* Firefox */ {
     
295. 0% {
     
296. transform:rotateY(180deg);
     
297. opacity:0;
     
298. }
     
299. 25% {
     
300. transform:rotateY(135deg);
     
301. opacity:0.3;
     
302. }
     
303. 50% {
     
304. transform:rotateY(90deg);
     
305. opacity:0.6;
     
306. }
     
307. 75% {
     
308. transform:rotateY(45deg);
     
309. opacity:1;
     
310. }
     
311. 100% {
     
312. transform:rotateY(0deg);
     
313. opacity:0;
     
314. }
     
315. }
     
316. @-webkit-keyframes mingjiao /* Safari 和 Chrome */ {
     
317. 0% {
     
318. transform:rotateY(180deg);
     
319. opacity:0;
     
320. }
     
321. 25% {
     
322. transform:rotateY(135deg);
     
323. opacity:0.3;
     
324. }
     
325. 50% {
     
326. transform:rotateY(90deg);
     
327. opacity:0.6;
     
328. }
     
329. 75% {
     
330. transform:rotateY(45deg);
     
331. opacity:1;
     
332. }
     
333. 100% {
     
334. transform:rotateY(0deg);
     
335. opacity:0;
     
336. }
     
337. }
     
338. @-o-keyframes mingjiao /* Opera */ {
     
339. 0% {
     
340. transform:rotateY(180deg);
     
341. opacity:0;
     
342. }
     
343. 25% {
     
344. transform:rotateY(135deg);
     
345. opacity:0.3;
     
346. }
     
347. 50% {
     
348. transform:rotateY(90deg);
     
349. opacity:0.6;
     
350. }
     
351. 75% {
     
352. transform:rotateY(45deg);
     
353. opacity:1;
     
354. }
     
355. 100% {
     
356. transform:rotateY(0deg);
     
357. opacity:0;
     
358. }
     
359. }
     
360. /*SC背景*/
     
361. @keyframes table1 {
     
362. 0% {
     
363. /*right:500px;*/
     
364. opacity:0;
     
365. }
     
366. 100% {
     
367. /*right:0px;*/
     
368. opacity:1;
     
369. }
     
370. }
     
371. @-moz-keyframes table1 /* Firefox */ {
     
372. 0% {
     
373. /*right:500px;*/
     
374. opacity:0;
     
375. }
     
376. 100% {
     
377. /*right:0px;*/
     
378. opacity:1;
     
379. }
     
380. }
     
381. @-webkit-keyframes table1 /* Safari 和 Chrome */ {
     
382. 0% {
     
383. /*right:500px;*/
     
384. opacity:0;
     
385. }
     
386. 100% {
     
387. /*right:0px;*/
     
388. opacity:1;
     
389. }
     
390. }
     
391. @-o-keyframes table1 /* Opera */ {
     
392. 0% {
     
393. /*right:500px;*/
     
394. opacity:0;
     
395. }
     
396. 100% {
     
397. /*right:0px;*/
     
398. opacity:1;
     
399. }
     
400. }
     
401. /*Staff列表*/
     
402. @keyframes staff {
     
403. 0% {
     
404. left:360px;
     
405. opacity:0;
     
406. }
     
407. 100% {
     
408. left:590px;
     
409. opacity:1;
     
410. }
     
411. }
     
412. @-moz-keyframes staff /* Firefox */ {
     
413. 0% {
     
414. left:360px;
     
415. opacity:0;
     
416. }
     
417. 100% {
     
418. left:590px;
     
419. opacity:1;
     
420. }
     
421. }
     
422. @-webkit-keyframes staff /* Safari 和 Chrome */ {
     
423. 0% {
     
424. left:360px;
     
425. opacity:0;
     
426. }
     
427. 100% {
     
428. left:590px;
     
429. opacity:1;
     
430. }
     
431. }
     
432. @-o-keyframes staff /* Opera */ {
     
433. 0% {
     
434. left:360px;
     
435. opacity:0;
     
436. }
     
437. 100% {
     
438. left:590px;
     
439. opacity:1;
     
440. }
     
441. }
     
442. /*cast列表*/
     
443. @keyframes cast {
     
444. 0% {
     
445. left:740px;
     
446. opacity:0;
     
447. }
     
448. 100% {
     
449. left:570px;
     
450. opacity:1;
     
451. }
     
452. }
     
453. @-moz-keyframes cast /* Firefox */ {
     
454. 0% {
     
455. left:740px;
     
456. opacity:0;
     
457. }
     
458. 100% {
     
459. left:570px;
     
460. opacity:1;
     
461. }
     
462. }
     
463. @-webkit-keyframes cast /* Safari 和 Chrome */ {
     
464. 0% {
     
465. left:740px;
     
466. opacity:0;
     
467. }
     
468. 100% {
     
469. left:570px;
     
470. opacity:1;
     
471. }
     
472. }
     
473. @-o-keyframes cast /* Opera */ {
     
474. 0% {
     
475. left:740px;
     
476. opacity:0;
     
477. }
     
478. 100% {
     
479. left:570px;
     
480. opacity:1;
     
481. }
     
482. }
     
483. /*chinadra链接*/
     
484. @keyframes chinadra {
     
485. 0% {
     
486. top:-540px;
     
487. opacity:0;
     
488. }
     
489. 100% {
     
490. top:-330px;
     
491. opacity:1;
     
492. }
     
493. }
     
494. @-moz-keyframes chinadra /* Firefox */ {
     
495. 0% {
     
496. top:-540px;
     
497. opacity:0;
     
498. }
     
499. 100% {
     
500. top:-330px;
     
501. opacity:1;
     
502. }
     
503. }
     
504. @-webkit-keyframes chinadra /* Safari 和 Chrome */ {
     
505. 0% {
     
506. top:-540px;
     
507. opacity:0;
     
508. }
     
509. 100% {
     
510. top:-330px;
     
511. opacity:1;
     
512. }
     
513. }
     
514. @-o-keyframes chinadra /* Opera */ {
     
515. 0% {
     
516. top:-540px;
     
517. opacity:0;
     
518. }
     
519. 100% {
     
520. top:-330px;
     
521. opacity:1;
     
522. }
     
523. }
     
524. /*bilibili链接*/
     
525. @keyframes bilibili {
     
526. 0% {
     
527. top:-540px;
     
528. opacity:0;
     
529. }
     
530. 100% {
     
531. top:-330px;
     
532. opacity:1;
     
533. }
     
534. }
     
535. @-moz-keyframes bilibili /* Firefox */ {
     
536. 0% {
     
537. top:-540px;
     
538. opacity:0;
     
539. }
     
540. 100% {
     
541. top:-330px;
     
542. opacity:1;
     
543. }
     
544. }
     
545. @-webkit-keyframes bilibili /* Safari 和 Chrome */ {
     
546. 0% {
     
547. top:-540px;
     
548. opacity:0;
     
549. }
     
550. 100% {
     
551. top:-330px;
     
552. opacity:1;
     
553. }
     
554. }
     
555. @-o-keyframes bilibili /* Opera */ {
     
556. 0% {
     
557. top:-540px;
     
558. opacity:0;
     
559. }
     
560. 100% {
     
561. top:-330px;
     
562. opacity:1;
     
563. }
     
564. }
     
565. /*missevan链接*/
     
566. @keyframes missevan {
     
567. 0% {
     
568. top:-540px;
     
569. opacity:0;
     
570. }
     
571. 100% {
     
572. top:-330px;
     
573. opacity:1;
     
574. }
     
575. }
     
576. @-moz-keyframes missevan /* Firefox */ {
     
577. 0% {
     
578. top:-540px;
     
579. opacity:0;
     
580. }
     
581. 100% {
     
582. top:-330px;
     
583. opacity:1;
     
584. }
     
585. }
     
586. @-webkit-keyframes missevan /* Safari 和 Chrome */ {
     
587. 0% {
     
588. top:-540px;
     
589. opacity:0;
     
590. }
     
591. 100% {
     
592. top:-330px;
     
593. opacity:1;
     
594. }
     
595. }
     
596. @-o-keyframes missevan /* Opera */ {
     
597. 0% {
     
598. top:-540px;
     
599. opacity:0;
     
600. }
     
601. 100% {
     
602. top:-330px;
     
603. opacity:1;
     
604. }
     
605. }
     
606. /*baidudisk链接*/
     
607. @keyframes baidudisk {
     
608. 0% {
     
609. top:-540px;
     
610. opacity:0;
     
611. }
     
612. 100% {
     
613. top:-330px;
     
614. opacity:1;
     
615. }
     
616. }
     
617. @-moz-keyframes baidudisk /* Firefox */ {
     
618. 0% {
     
619. top:-540px;
     
620. opacity:0;
     
621. }
     
622. 100% {
     
623. top:-330px;
     
624. opacity:1;
     
625. }
     
626. }
     
627. @-webkit-keyframes baidudisk /* Safari 和 Chrome */ {
     
628. 0% {
     
629. top:-540px;
     
630. opacity:0;
     
631. }
     
632. 100% {
     
633. top:-330px;
     
634. opacity:1;
     
635. }
     
636. }
     
637. @-o-keyframes baidudisk /* Opera */ {
     
638. 0% {
     
639. top:-540px;
     
640. opacity:0;
     
641. }
     
642. 100% {
     
643. top:-330px;
     
644. opacity:1;
     
645. }
     
646. }
     
647. /*linkcolor链接*/
     
648. @keyframes linkcolor {
     
649. 0% {
     
650. color:#F00;
     
651. }
     
652. 20% {
     
653. color:yellow;
     
654. }
     
655. 40% {
     
656. color:green;
     
657. }
     
658. 60% {
     
659. color:pink;
     
660. }
     
661. 80% {
     
662. color:gry;
     
663. }
     
664. 100% {
     
665. color:blue;
     
666. }
     
667. }
     
668. @-moz-keyframes linkcolor /* Firefox */ {
     
669. 0% {
     
670. color:#F00;
     
671. }
     
672. 20% {
     
673. color:yellow;
     
674. }
     
675. 40% {
     
676. color:green;
     
677. }
     
678. 60% {
     
679. color:pink;
     
680. }
     
681. 80% {
     
682. color:gry;
     
683. }
     
684. 100% {
     
685. color:blue;
     
686. }
     
687. }
     
688. @-webkit-keyframes linkcolor /* Safari 和 Chrome */ {
     
689. 0% {
     
690. color:#F00;
     
691. }
     
692. 20% {
     
693. color:yellow;
     
694. }
     
695. 40% {
     
696. color:green;
     
697. }
     
698. 60% {
     
699. color:pink;
     
700. }
     
701. 80% {
     
702. color:gry;
     
703. }
     
704. 100% {
     
705. color:blue;
     
706. }
     
707. }
     
708. @-o-keyframes linkcolor /* Opera */ {
     
709. 0% {
     
710. color:#F00;
     
711. }
     
712. 20% {
     
713. color:yellow;
     
714. }
     
715. 40% {
     
716. color:green;
     
717. }
     
718. 60% {
     
719. color:pink;
     
720. }
     
721. 80% {
     
722. color:gry;
     
723. }
     
724. 100% {
     
725. color:blue;
     
726. }
     
727. }
     

复制代码