Diverではデフォルトで文字に蛍光ペンを引いたようなマーカーをつける機能が実装されています。
（動くアニメーションマーカーもデフォルトで入ってるから便利！）
でも、フォントをNoto Sans JPに変えてしまったからか、マーカーの色がちょっと濃すぎて違和感。
ここは早々にマーカー色を変更しちゃおう。
ついでに、マーカー引いた時に太字になるようにカスタマイズしちゃいます！
Contents
Diverの蛍光マーカー色を変更するCSS
デフォルトでマーカーと動くマーカーが入ってる時点で感謝なんですけど。
でも私が使ってるフォントでマーカーを引くと、下の画像のようになってしまいます。
（動かない）マーカーは太字になってないし、かといって動くマーカーは太字になってるけど、Noto Sans JPの太字がすぎて、せっかくの黄色マーカーが滲んでしまっているような感じでもったいない。
うーん。
やっぱりここはカラー変更してしまいましょ！
マーカーの色は薄い黄色にして太字に変更
マーカーを引いたときに、フォントの太さがそのままだと逆に読みづらい感じもするのかな？
どうせマーカーを引くのなら、太字でがっつり目立たせたい。
でも太字にするだけだと、デフォルトの動くマーカーのようにフォントとの相性がよくない。
（フォントによっては太字にするだけでもいいと思う）
なので、「外観」⇒「カスタマイズ」⇒「追加CSS」に以下を追記しました。
/*マーカー太字＆薄い黄色 */
.sc_marker {
background: linear-gradient(transparent 50%,#FFFF7A 50%);
font-weight: bold;
}カラーを#FFFF7Aにして、太字に。
色は好みでピンクとか水色とか変更してもOK。（半角でね）
#ffcccc（淡い赤）とか#ccffff（水色）とかどうでしょう？動くマーカーの色を変更する
動くマーカーはちょっと長めの文章を強調したい時に便利。（逆に短い文章で使っちゃうとあんまり意味ないかも）
長いといっても、1行以内が程度ってものでしょうけど。（スマホで見た時はしょうがないよね）
どうせなら、薄い黄色にするんじゃなくて、色をガラっと変更してみたいと思います。
/*動くマーカー弱い赤 */
.sc_marker-animation.active {
background-position: -100% .4em;
transition: 2.5s;
}
.sc_marker-animation {
background-image: -webkit-linear-gradient(left,transparent 50%,#FFCCCC 50%);
background-image: -moz-linear-gradient(left,transparent 50%,#FFCCCC 50%);
background-image: -ms-linear-gradient(left,transparent 50%,#FFCCCC 50%);
background-image: -o-linear-gradient(left,transparent 50%,#FFCCCC 50%);
background-image: linear-gradient(left,transparent 50%,#FFCCCC 50%);
background-repeat: repeat-x;
background-size: 200% .8em;
background-position: 0 .5em;
font-weight: bold;
}先ほどの弱い赤（#FFCCCC）に変更。
マーカー（蛍光ペン）におすすめの色コードは？
マーカーの色って、以前に紹介したカラーコードサイトで確認してみても、文字が被ると色の見え方が変わってくるから、選ぶのに悩んでしまいます。
おすすめのカラーコードを一部紹介しますので、参考にしてみてくださいね。
普通のピンク（#ffdbff）
オレンジ（#ffddbc）
淡いパープル（#ead6ff）
普通の水色（#ccffff）
意外と緑（#ccffcc）
はっきり黄緑（#ccff99）
落ち着いた水色（#DCEEFF）
はっきり水色（#AFEFFF）
優しい水色（#E5FBF8）
落ち着いた水色（#c9efef）
AddQuicktagを使ってマーカーの色を増やす
Diverをビジュアルエディタで使用すると、黄・赤・青のマーカーがデフォルトで入っていますが、
テキストエディタを使用する場合は黄色1色のみ。
もうちょっとマーカー色を増やしたい、という場合はAddQuicktagを使うのが俄然便利です。
先ほど紹介したように、元々のマーカーはこのようにコードが指定されています。
.sc_marker {
background: linear-gradient(transparent 50%,#ff6 50%);
}今回はピンクと青の2色を追加してみましょうか。
/*マーカー太字＆ピンク */
.sc_marker1 {
background: linear-gradient(transparent 50%,#ffdbff 50%);
font-weight: bold;
}
/*マーカー太字＆青 */
.sc_marker2 {
background: linear-gradient(transparent 50%,#E5FBF8 50%);
font-weight: bold;
}子テーマのstyle.css、もしくは追加CSS（外観→カスタマイズ）に上記コードを追加します。（カラーコードはお好みで）
その後、AddQuicktagの設定画面へより、
以下コードの文字（ピンクマーカー）前後をそれぞれコピペ。
<span class="sc_marker1">ピンクマーカー</span>
（クリックで拡大します）
ラベル名はお好みで。
右側のチェックは、一番右のマスをクリックすれば全部にチェックが入ります。
AddQuicktagは1つずつしか登録できないので、1色登録してからもう1色登録…。
ブルーのコードはこちら↓（文字前後をそれぞれコピペ）
<span class="sc_marker2">水色マーカー</span>すべて登録が終わったら、テキストエディタに戻ります。
タグが増えているので、マーカーをひきたい文字を範囲指定して、クリックすると…
このように好みのマーカーを追加することができます。
AddQuicktagはDiverの会話機能でも使っているので、ぜひ登録してみてくださいねー！
おしまいに
単語や文章を強調するのに便利なマーカー機能。
ついいろんな色を使いたくもなりますが、でも基本は1~2色までの使用に留めておくほうがきれいです。
私が使うマーカーも薄い赤と水色系（たまに黄色）くらい。
それぞれの色に用途を指定しておくと、より見やすくなるかと思います。
（例）
強調したいところは赤マーカー
注意を促したいところは黄マーカー
など。
上手に使い分けですっきり読みやすい記事にしたいですね！
