以前の記事「続きを読む」をカッコ良く-wordpress twentyelevenカスタマイズで、「続きを読む」ボタンをカスタマイズして角丸・グラデーション・影つきにしました。今度は、ボタンを押したときにちょっとしたアクションを加えてみたいと思います。

前回.entry-content .more-link:hoverにスタイルをあてましたが、これはボタンにマウスが乗っかったときのスタイルです。

今回は.entry-content .more-link:activeで、ボタンをクリックしたときのスタイルをあてます。

ボタンを押したときに少々へこんで見えるように、影をなくします。

.entry-content .more-link:active{
box-shadow: #000000 0px 0px 0px; 
}

これで、冒頭の画像にあるように、押したときに凹んだ用に見えるボタンの出来上がりです。