はてなブログのCSSを今風にいじってみる。

はてなブログのデフォルトテーマって、ちょっと野暮ったくない?

と思ったので、今っぽいデザインにするために2箇所いじってみた。

 

見出しをふせんみたなやつにする。

いかのサイトの、「よくあるやつ」をコピペした。

www.yukihy.com

    .entry-content h3{
    color: #444444;
    padding: 10px 15px; 
    border-left: 10px solid #e07000;
    border-bottom: 1px solid #e07000;
    }

 これでよくある付箋風の見出しがかける、

これがよくある付箋風の見出しだ!!まいったか!!

マーカー風のアンダーラインを引く

mu2in.hatenablog.com

 このサイトのコードをコピペした。

    /* 強調表示を蛍光ペン風に */
article strong{
    margin:0 0.1em;
    padding:0.1em 0.2em;
    background:#fcfc60 !important;
    background:linear-gradient(to bottom, transparent 60%, rgba(252,252,84,0.8) 60%) !important;
}
/* bタグは太字 */
article b{
    font-weight:bold !important;
}

これで、見たまま編集の「B」でできるはず。

 

これがマーカー風の強調表示だ!!

 

なお、これらの設定を書く場所は、「CSSのデザイン」ではなく「ヘッダ」のところらしい。CSSデザインのところに書くと、スマホで有効にならないらしい。