この記事を読むのに必要な時間は約 4 分です。
動くラインマーカー
前説
ブログで記事を紹介するときに、特にみて欲しい場所は下色を付けて目立つようにすると思います。
例えばこんな感じですね！！
ただ、大学生のノートのように
こんな感じで線を引っ張るとちょっとおしゃれに見えませんか？
本日はプラグインを使ってこんなおしゃれなラインを引く方法を紹介します！！
まずはプラグインのインストールを！！
プラグインを使うことによってこのライン下地は簡単に設定することができます。
プラグインの名前は
です！
プラグインはこちらからダウンロードできます
↑
導入方法なども記載していますので詳細は確認してください！
導入が終わったら個別設定を行います。
左側のメニューから
を選んで、カラーの設定をしていきます。
下地色を引くオプションは id5番ですので5番を選択した状態で色を設定します！
淡い感じのを設定するとおしゃれな感じになります。
逆に濃ゆい色を選択すると、どぎつく目立つような感じにすることができます！
あと、好みの太さを色１～色5で選びます。
今回は淡い感じで真ん中ぐらいまでの太さの色を設定してみましょう！！
設定を以下のように color5だけ入れて、残りは空白で設定し、
色は【#a0d67a】を選択しています。
送信ボタンを押して以下のようになれば成功です。
設定してみる
それでは以下の通り書いてみてください。
[do＠ class=c5 word=大学生のノートのようにおしゃれな感じになっているかな？]
↑@の部分を h に変換してください。
すると・・・
こんな感じになります！！
＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋
[doh class=c5 word=大学生のノートのようにおしゃれな感じになっているかな？]
＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋＋
※古いブラウザやie,edgeの人は表示されない場合がありますので画像版も
ちゃんと引けましたか？
そして、ここまで言っていませんでしたが、このライン [doh class=c1 word=動きます！！]
びっくりですねー
蛍光ペン風の装飾をするプラグインやCSSの紹介は結構ありますけど動く蛍光ペンの設定ができるのはこの
ぐらいだと思います！！※たぶん
記事を目立たせたい人はぜひ試してください！！
(´◉◞౪◟◉)
