1. [图片] 201411232307357663.jpg
2. [代码][html]代码
1
shiny span > span >
3. [代码][css]代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
body
{
   background : #111 ;
}
.shiny
{
   color : #f5c21b ;
   background : -webkit-gradient(linear, left top , left bottom , from( #f5c21b ), to( #d17000 ));
   -webkit-background- clip : text;
   -webkit-text-fill- color : transparent ;
   display : block ;
   width : 610px ;
   margin : auto ;
   font-family : source sans pro , sans-serif ;
   font-size : 13em ;
   font-weight : 900 ;
   position : relative ;
   text-transform : uppercase ;
}
.shiny::before
{
     background-position : -180px ;
     -webkit-animation: flare 5 s infinite;
   -webkit-animation-timing-function: linear;
   background-image : linear-gradient( 65 deg, transparent 20% , rgba( 255 , 255 , 255 , 0.2 ) 20% , rgba( 255 , 255 , 255 , 0.3 ) 27% , transparent 27% , transparent 100% );
   -webkit-background- clip : text;
   -webkit-text-fill- color : transparent ;
   content : shiny ;
   color : #fff ;
   display : block ;
   padding-right : 140px ;
   position : absolute ;
}
.shiny::after
{
   content : shiny ;
   color : #fff ;
   display : block ;
   position : absolute ;
   text-shadow : 0 1px #6e4414 , 0 2px #6e4414 , 0 3px #6e4414 , 0 4px #6e4414 , 0 5px #6e4414 , 0 6px #6e4414 , 0 7px #6e4414 , 0 8px #6e4414 , 0 9px #6e4414 , 0 10px #6e4414 ;
   top : 0 ;
   z-index : -1 ;
}
.inner-shiny::after, .inner-shiny::before
{
         -webkit-animation: sparkle 5 s infinite;
   -webkit-animation-timing-function: linear;
     background : #fff ;
   border-radius: 100% ;
   box-shadow: 0 0 5px #fff , 0 0 10px #fff , 0 0 15px #fff , 0 0 20px #fff , 0 0 25px #fff , 0 0 30px #fff , 0 0 35px #fff ;
   content : ;
   display : block ;
   height : 10px ;
   opacity: 0.7 ;
   position : absolute ;
   width : 10px ;
}
.inner-shiny::before
{
     -webkit-animation-delay: 0.2 s;
   height : 7px ;
   left : 0.12em ;
   top : 0.8em ;
   width : 7px ;
}
.inner-shiny::after
{
   top : 0.32em ;
   right : -5px ;
}
@-webkit-keyframes flare
{
   0%   { background-position : -180px ; }
   30%  { background-position : 500px ; }
   100% { background-position : 500px ; }
}
@-webkit-keyframes sparkle
{
   0%   { opacity: 0 ; }
   30%  { opacity: 0 ; }
   40%  { opacity: 0.8 ; }
   60%  { opacity: 0 ; }
   100% { opacity: 0 ; }
}