bloggerのトップページの記事と記事の間に区切り


トップページで記事と記事の境界がわかりづらかったので区切り線を追加。hrタグは使わず、各記事の囲みのうち、下側の境界にborderをつけることにした。パディングを3文字分としたら、わりとちょうどよかった。明度は60%にした。(256*60%=153.6であり、0d153は16進数で0x9A)。これは、色彩検定で学んだことだが、視認性をよくするには明度差40%以上が目安で、白背景(明度100%)に対しては明度60%以下のものを使うべきだからだ。

  1. レイアウトからhtml編集を開く。
  2. css部分 (skinで検索すると見つかる)を開く。
  3. .postというクラスがあるので、二行を追加


.post {
  margin: 0 0 $(post.margin.bottom) 0;
  border-bottom: 1px solid #9A9A9A;    /* shows a border under a post. added on September 30, 2015 */
  padding-bottom: 3em;                 /* shows a border under a post. added on September 30, 2015 */
}


昨日からレイアウトを様々に変更して、トップページはスッキリとし、個別ページは類似記事で充実した。

コメント