先日、はてなブログがアップデートされ、サイドバーに表示される「最新記事モジュール」で設定された表示件数を超える場合「もっと見る」リンクを表示できるようになりました。
INDEX
生成されるhtml
<div class="urllist-see-more recent-entries-see-more"> <a href="https://www.foxism.jp/archive" class="urllist-see-more-link recent-entries-see-more-link"> もっと見る </a> </div>
実際に表示させてみたところ、上記のようなhtmlでした。すごくシンプル。そしてここにデフォルトでは特にcssはついてないようでした。(継承されるもののみ)
とりあえずのcss
まぁhtmlもシンプルですし、とくに大きな装飾する必要もないので、私の場合は簡単に枠で囲っておきました。
.urllist-see-more-link{ display: block; border: 1px solid #999; text-align: center; line-height: 2.5; }
::beforeを使って「もっと見る」の前にアイコンを表示させてもいいかもしれませんね。
とりあえず、そんなとこで。