はてなブログの下線を色付きマーカーにする｜ブログ初心者が最初にしたいカスタマイズ

このサイトにたどり着いた人は、強調したい部分にこういったマーカーを引きたい人だと思います。この記事から約５分、４ステップでカスタマイズできます。方法はいろいろありますが、これが一番設定が簡単で便利だったので紹介します。

この記事でできること

黄色いマーカー線が引ける
太字＋ピンクのマーカー線が引ける

1クリックで引けます。

参考にした記事はコチラ

最速手順

①コピーする⇩
（ガジェレポ！さんサイトより引用）

<style type="text/css">

/* 強調表示を蛍光ペン（ピンク）風に */

article strong{

    margin:0 0.1em;

    padding:0.1em 0.2em;

    background:#fcfc60 !important;

    background:linear-gradient(to bottom, transparent 60%, rgba(255,153,255,1) 60%) !important;

}

/* bタグは太字 */

article b{

    font-weight:bold !important;

}

/* 斜体表示を蛍光ペン（黄）風に */

article em{

    font-weight:bold;

    font-style: normal;

    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;

}

/* iタグは斜体*/

article i{

    font-style:oblique !important;

}

/* アンダーライン表示を蛍光ペン（緑）風に */

article u{

    font-weight:bold;

    text-decoration: none;

    margin:0 0.1em;

    padding:0.1em 0.2em;

    background:#fcfc60 !important;

    background:linear-gradient(to bottom, transparent 60%, rgba(102,255,204,1) 60%) !important;

}

</style>

②自分のブログ
　→デザイン
　　→カスタマイズ(スパナマーク)
　　　→ヘッダ
　　　　→タイトル下

③ペーストする

④変更を保存する

これで設定は完了です。

実際に使ってみる

強調したい文を選択後、ツールバーの

「太字(B)」を押すとプレビューで太字＋ピンクに、「斜線(i)」を押すプレビューで黄色になりました。(見たまま編集での見た目は変わりません)

色付きのマーカーを使うだけで文章が華やかになり、読みやすくなります。ブログを始めたらまず設定したいカスタマイズですね。あまり引きすぎると逆に読みづらいのでそれだけ注意。

ＢｙｅＢｙｅ✋