はてなブログ無料版でできること⑧ 「斜体」ボタンを「マーカー」に変更
はてなブログ無料版でできるカスタマイズ第８弾。
今回はよくブログ記事でみると思います、マーカーを簡単にひくためのカスタマイズです。
今回はこちらの記事を参考にさせていただきました m(_ _ )m
「斜体」を「マーカー」に
マーカーを引きたいところに、例えばですけど
<span class="marker_pink">マーカー</span>
みたいなタグを打ち込む方法もあるのです。
ただ、「HTML編集」でいちいち入力しないといけないってめんどくさいですよね…
ということで、はてなブログのツールバーにある編集ボタンに「マーカー」を割り当てちゃおう！ということです。
そうすると、該当部分を選択してボタンをポチッと押せばマーカー引けちゃいます！素晴らしい！
で、今回はあまり使用しない「斜体」ボタンを「マーカー」ボタンにしちゃおう！という試みです。
CSSコード
CSSは「linear-gradient()属性」を使います。
今回も、「デザイン」→「カスタマイズ」→「デザインCSS」に次のコードを入力するだけです。
article em{
font-weight:bold;
font-style: normal;
margin:0 0.1em;
padding:0.1em 0.2em;
background:linear-gradient(transparent 60%, #f6bfbc 60%);
}
最後のところを自由に変更してくださいね！
linear-gradient(transparent 線の太さ, 線の色 線の太さ)
線の太さ
線の太さは0%が太くて、100%が一番細いです。そうなんです、逆です。
0%のマーカー
99%のマーカー
線の色
色はこちらから好きな色を選んでね！
いかがでしたでしょうか？
このシリーズ、まだまだ続きますよ〜
