文字にマーカー線を引く流行りのHTMLコードです。

WEBサイトが見やすくなるだけでなく、強調したい文字をデザインに仕上げることができます。

細いマーカー線

赤マーカー

<span style="background: linear-gradient(transparent 70%, #ff7f7f 0%);">赤マーカー</span>

青マーカー

<span style="background: linear-gradient(transparent 70%, #7fbfff 0%);">青マーカー</span>

黄マーカー

<span style="background: linear-gradient(transparent 70%, #ffff7f 0%);">黄マーカー</span>

緑マーカー

<span style="background: linear-gradient(transparent 70%, #bfff7f 0%);">緑マーカー</span>

紫マーカー
<span style="background: linear-gradient(transparent 70%, #db82ff 0%);">紫マーカー</span>
桃マーカー
<span style="background: linear-gradient(transparent 70%, #ff91f6 0%);">桃マーカー</span>

全てマーカー線

赤マーカー

<span style="background: linear-gradient(transparent 0%, #ff7f7f 0%);">赤マーカー</span>

青マーカー

<span style="background: linear-gradient(transparent 0%, #7fbfff 0%);">青マーカー</span>

黄マーカー

<span style="background: linear-gradient(transparent 0%, #ffff7f 0%);">黄マーカー</span>

緑マーカー

<span style="background: linear-gradient(transparent 0%, #bfff7f 0%);">緑マーカー</span>

紫マーカー
<span style="background: linear-gradient(transparent 0%, #db82ff 0%);">紫マーカー</span>
桃マーカー
<span style="background: linear-gradient(transparent 0%, #ff91f6 0%);">桃マーカー</span>

引用・参考サイト

引用させて頂いた「Pのケシキ」様のページ。

非常に見やすくて分かりやすいHTMLコードを掲載されています。