記事を編集するにあたって、太字を使用する頻度はかなり高いですよね。ただ、初期設定のままだと、あまり目立たなかったり、なんだかダサかったり...もっといい感じに強調したくなるものです。
実は、css設定をするだけで、太字コマンドを蛍光ペン風にする事が可能です。さっそく設定方法を見ていきましょう。
実は、css設定をするだけで、太字コマンドを蛍光ペン風にする事が可能です。さっそく設定方法を見ていきましょう。
太字にする方法
左上のコマンドを使うことで、太字にしたり、下線付けたりできる事はご存知ですよね。一応おさらいとして、太字にするためには文字を選択した状態で、Bコマンドを押すとできます。
ちなみに、文字を選択した状態で、Ctrl+Bを押しても太字にすることができますよ。
ちなみに、文字を選択した状態で、Ctrl+Bを押しても太字にすることができますよ。
さっそくcssを設定しよう
/*太文字マーカー*/ .entry-content strong { background: linear-gradient(transparent 60%, #ffff00 40%); font-weight:bold; }
自分の好みに調整しよう
黄色の蛍光マーカーを気に入ってくれれば、このまま使用してくれてもいいですが、
(transparent 60%, #ffff00 40%)の部分は
(transparent マーカーの太さ、マーカーの色、マーカーの濃さ)
となっており、これらは自分の好みに変更することができます。
①マーカーの太さを変更しよう
マーカー太さは、現在60%となってる部分のコードで決まります。
パーセンテージが低いほど、線は太くなります。
②好みの色に変更しよう
色の設定は、#ffff00の部分のコードによって決まっています。
- 青なら→ #0000ff
- オレンジなら→ #ffa500
- 赤なら→ #ff0000
といった具合で、コードを変更すると色が変わります。今は黄色(#ffff00)が入ってますので、下記のカラーコードサイトから、自分の好きな色を引っ張ってきましょう。
③マーカーの濃さを変更しよう
マーカー濃さは、現在40%となってる部分です。
パーセンテージが低いほど、線は濃くなります。
変更を保存すると、設定完了です。お疲れ様でした!