css3 卡片亮光_纯css3特效实现的文字亮光

纯css3特效实现的文字亮光

演示地址：http://www.huiyi8.com/css3/

[代码] [CSS]代码

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 5s infinite;

-webkit-animation-timing-function: linear;

background-image: linear-gradient(65deg, transparent 20%, rgba(255, 255, 255, 0.2) 20%, rgba(255, 255, 255, 0.3) 27%