【はてなブログ】「続きを読む」をよく見る感じに。
実はこのブログもちょくちょくカスタマイズしてます。自分が見やすいようにやっているのですが、まだまだたくさんやりたいことありますね。今回は「続きを読む」についてカスタマイズしてみました。デフォルトの続きを読むリンクは単なる文字リンクなのでわかりにくいし、味気ないのでね。
参考記事はこちら
blog.sumaho-design.com
こんな感じ↓になります。続きを読めば設定コードが!
以下のコードを「デザインcss」の中に貼り付けます。
/*続きを読むボタン*/ a.entry-see-more { word-wrap:break-word; border: solid 1px darkcyan; padding: 5px 20px; color:darkcyan; background:white; border-radius: 5px; } /*続きを読むボタンのマウスオーバー*/ a.entry-see-more:hover { word-wrap:break-word; border: solid 1px darkcyan; padding: 5px 20px; color:white; background:darkcyan; border-radius: 5px; }
通常時
マウスオーバー時
どうすかね。ターコイズ(ダークシアン)という色が個人的に好きなので基調色にしてみてます。
他にも色はたくさんあり、コード内でどう入れていいかわからない時にはこちらを参照
www.tagindex.com
またカスタマイズしたらメモします。