読者です 読者をやめる 読者になる 読者になる

ふたばの日記

高等教育や学術政策に関心がある大学生のブログです。考えたことのメモなど。

見出しのカスタマイズ

このはてなブログ、Handwritingというテーマを利用しているのだけれど、デフォルトでh1-4まですべて同じ表示(しかも謎のリボンが冒頭につく)という仕様になっていて、階層が不明でイライラするので見出しをカスタマイズしてみた。 正直あまり気に入っていないものの、マシにはなったのでひとまず良しとしておこう。

なお、この編集はデザイン→カスタマイズ→CSSでできる。

見出し1

.entry-content h1{
color: #524336; / 文字の色 /
font-size:150%; / フォントの大きさ /
font-weight:bold; / 太字 /
line-height: 1.5em; / 行間 /
border-top:1px solid #524336; / 上線 /
border-bottom:1px solid #524336; / 下線 /
border-left:10px solid #524336; / 左側の線 /
margin: 70px 0 10px 0; / 上下の余白 /
padding:10px 10px 10px 10px; / テキストとボーダーの間の余白 /
background:#ffffff; / 背景の色 /
}

見出し2

.entry-content h2{
color: #524336; / 文字の色 /
font-size:130%; / フォントの大きさ /
font-weight:bold; / 太字 /
line-height: 1.5em; / 行間 /
border-bottom:1px solid #524336; / 下線 /
border-left:5px solid #524336; / 左側の線 /
margin: 40px 0 10px 0; / 上下の余白 /
padding:10px 10px 10px 10px; / テキストとボーダーの間の余白 /
background:#ffffff; / 背景の色 /
}

見出し3

.entry-content h3{
color: #524336; / 文字の色 /
font-size:120%; / フォントの大きさ /
font-weight:bold; / 太字 /
line-height: 1.5em; / 行間 /
border-bottom:1px solid #524336; / 下線 /
margin: 20px 0 10px 0; / 上下の余白 /
padding:10px 10px 1px 10px; / テキストとボーダーの間の余白 /
background:#ffffff; / 背景の色 /
}

見出し4

.entry-content h4{
color: #524336; / 文字の色 /
font-size:110%; / フォントの大きさ /
font-weight:bold; / 太字 /
line-height: 1.5em; / 行間 /
margin: 0px 0 10px 0; / 上下の余白 /
padding:10px 10px 1px 10px; / テキストとボーダーの間の余白 /
background:#ffffff; / 背景の色 /
text-decoration:underline; / 下線 /
}