
CSS3でフェードイン・フェードアウトボタンをつくる
2014年3月28日CSSテクニック
jQueryを使わずCSS3だけでフェードイン・フェードアウトするボタンをつくります。
CSS
#button { display: block; width: 100px; margin: 0 auto; } #button a { display: block; width: 100%; border: 1px solid #52d3ff; background-color: #52d3ff; color: #ffffff; padding: 12px 0; text-align: center; text-decoration: none; transition: .2s linear; -webkit-transition: .2s linear; -moz-transition: .2s linear; -o-transition: .2s linear; -ms-transition: .2s linear; } #button a:hover { background-color: #ffffff; color: #52d3ff; }