これが標準の見出しなのですが、ちょっとわかりにくいのでかえます。
こうします。(主見出しは、使わないので変えませんでした。)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_vnNQrXMk0WZwtrOjekxMPDbeW8M_TImnJjTEFj4gl7_Srwgwto63z_r1gIXtoAja-b33zK6OJ47f2b95_g7CBZIYNo7LgQ6ANbCPkPOK4x1gJVJgZmOGpqOjJfOl1IdpsZUtnhxdx2socKPLSBwkraRb_i0tp76v7A2KVrROX_eaIbzwdrZPE_JGXQ/w533-h267/3.%E8%A6%8B.png)
記事の見出しなので、Postsの設定が入っているあたりにいれました。
このあたりです。
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7oltxXgxxRJBrzB5Rvv-U74MyI8H3oR7i4YmejOAu13T8457i7u6H-ad8L30Jsj92FGW_lqZyC0ShXG9GZnDzdZ9M9Zy0h1AT-CIr2e5NE05sV1GMXdMwaaoTdFhZq12HU-okUhtFWotgABiZe1c9AZ_g9MgPt__SIenPLGseUDtVvSJvxmHbm0MdHw/w579-h219/2.%E8%A6%8B.png)
追記したのはこの内容です。
.post-body h2{
font-weight: bold;
padding: .8em .5em;
margin-bottom: 0.5em;
margin-top: 1.5em;
border-radius: 2px;
line-height: 1.2;
background: #00bcd4;
color: #ffffff;
}
.post-body h3{
font-weight: bold;
margin-bottom: 0.5em;
margin-top: 1.5em;
padding: .5em 0;
line-height: 1.2;
border-bottom: solid 2px #00bcd4;
}
.post-body h4{
background: transparent;
border: 0;
position: relative;
padding: 0;
padding-left: 1.4em;
border-radius: 2px;
margin: 0.5em 0 0.5em;
margin-top: 1.5em;
line-height: 1.25;
font-weight: bold;
box-sizing: border-box;
overflow-wrap: break-word;
}
.post-body h4::before{
height: 1em;
border-radius: 50%;
width: 1em;
left: 0;
top: 0;
background: #00bcd4;
content: "";
position: absolute;
}
見出しは色々なデザインにできるので、悩みますね。どんな組み合わせにするか、難しい。