真ん中から放射状に一応広がっていく表現ですが…。
CSS： .LBtn{ /* A */ display:inline-block; padding: 10px 15px; border:1px solid #000; border-radius: 15px; font-family:ＭＳ Ｐゴシック; font-size:15pt; font-weight:bold; letter-spacing:0px; line-height:1.2; color: #000; text-decoration: none !important; background-position:50%; background-size: 90%; background-image: radial-gradient(circle at 50%,#fff,#bfb,#99f,#888); transition: background-size 1s linear 0s; } .LBtn:hover{ background-size: 500%; } .LBtn:active{ background-color:#f88; background-image: none; }
HTML： <A class=LBtn href="">てすとです</A>