【非公式】はてなブログの手引き

アドセンス合格→はてなブログ収益化!

【はてなブログ】はてなブログで文字装飾「マーカー」を使う方法

今回はかなり細かい部分の話ですが、はてなブログ初心者が一度は気になるところだと思うので紹介します。

 

何かというと、文字装飾「マーカー」を使う方法です。

なぜこんなことが議論になるのかというと、デフォルトの機能で備わっていないからです。(それくらいは基本機能としてあっていいと思うのですが。)

 

 

ですが、機能がないからといって使えないわけではありません。今からお教えするコードを「デザインCSS」にコピペし、そしてマーカーを使いたい時にタグで囲う、それだけで実現できます。

(今回紹介する方法は、太字・黄色・文字の下側40%にかかるマーカーです。)

 

デザインCSSにコピペするコードはこれです。

貼り付ける場所は「🎨デザイン」→「🔧カスタマイズ」一番下の「{ }デザインCSS」です。(すでにコードを書き込んでいる方は、そちらを削除・改変してしまわないようご注意ください。)

.marker {

 background:linear-gradient(transparent 60%, #ffff00 0%);

}

 

事前にやることはこれだけです。そして、実際にマーカーを使うには「HTML編集」に変えて、マーキングしたい文字を<strong class="marker">と</strong>で囲ってください。「編集 見たまま」だと太字にしかなっていませんが、「プレビュー」にするとマーカーになっているはずです。

 

マーカーだけで太字にしたくなければ、<strong class =~></strong>ではなく、<span class =~></span>にしてください。(デザインCSSのほうは同じです。)

 

この方法で、はてなブログでもマーカーを使うことができます。自分でさらにカスタマイズしたい方は「linear-gradient」で検索してみるといいでしょう。

 

太字赤太字だけでも事足りるかもしれませんが、マーカーも使えるようにしておくと、表現の幅が広がると思います。マーカーを使いたいと思った方は、やってみてください。

 

ブログトップに戻る