他人のブログを見ている時に、トップページの記事一覧がタイル状に表示されるように設定してあり、「おしゃれでいいなぁ~」と思ったことはありませんか? 今回はそんな人のために、cssの記述だけで簡単にトップ画面の記事一覧をタイル状に変更する方法をご紹介したいと思います。 コピペで設定できるようにしているため、とても簡単に設定可能です! 注意 今回の方法は「はてなブログpro」である事が前提となります。 トップ一覧をカードタイプからタイル状に変更する方法 CSSの記述内容 プレビュー スマートフォン表示は通常にしたい場合 CSSの記述内容 CSSが反映されない場合の対処法 最後に トップ一覧をカードタイプからタイル状に変更する方法 まずは、はてなブログの「設定>詳細設定」の中にあるトップページの表示形式を一覧形式に変更してください。 CSSの記述内容 CSS /*-----------------
![【はてなブログ】記事一覧をCSSの設定だけでタイル表示にする方法 - うさぎ日和](https://cdn-ak-scissors.b.st-hatena.com/image/square/aa0826d26d9e1218014da18195a474f21be3c3d1/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2FD%2FDwarfRabbit%2F20200327%2F20200327165302.jpg)