【はてなブログ】ブログの文章にマーカーみたいな下線を引いてみた！【はじめてのHTMLとCSS】strong？span？
見やすいブログを書くために、マーカー線が引きたい！～part1～
ブログを始めて数日。見やすくオシャレに見るためにはどうしたら・・・
そう思ってたところ、読みやすいブログはキーワードにオシャレな下線が引いてあることに気づきました！
そこでさっそくやり方を検索。
参考サイト
こちらのサイトが一番イメージ通りでわかりやすかったです。
ふむふむ。
こちらのサイトでは、URLをコピペして使えるのはもちろん、HTMLやCSSをよく知らない初心者にもわかりやすく構造の説明をしてくれています。
なので、コピペしたいけど一応意味は理解しておきたい！っていう、私のようなわがまま初心者さんにぴったりです！
手早くやりたい方はもう ↑ のサイト参考にしてください。
ここからは、それ以外の基礎さえ理解してない私と０から学んでいくコーナーです！
さっそくやってみよう！
↓こちらをコピペするとこのようなピンクラインが引けるらしい。
【html】
<strong class="pink_line">テキスト</strong>
【CSS】.pink_line {background:linear-gradient(transparent 60%, #ffdfef 0%) ;}
貼り付ける場所
htmlとCSSをそれぞれの場所に張り付けます。
皆さんご存知だと思いますが、超初心者は迷ったので念のため。
(はてなブログを使っています。)
・【html】HTML編集の画面で本文に張り付け。
・【CSS】デザイン＞カスタマイズ＞｛｝デザインCSS に張り付け。
これでできるはず！
ところで、このstrongタグってなんなの？
実は今回紹介したサイト以外には、<strong>の他に<span>を使っているサイトもありました。むしろspanの方が多かったかも。
そこで、まだタグの意味について全く知らない私は調べてみました、、、
strongタグについてはこちらで学ばせていただきました。
まとめると
strongタグは
・重要性をコンピュータに示す
・デフォルトで太字にする
・乱用するとペナルティーの危険あり
spanタグは
・ほかの文章との区別する
（色の指定や装飾に多用される）
という役割があるそう、、、。
あれ、spanのほうがいいんじゃない？？
ということでstanタグで書いてみるとこんなかんじになります。
strongタグだとデフォルトで太字になるので設定だそう。なので、spanタグにかえると太字にならないでマーカーが引けます。
どちらがいいかは好みですね
そのほか強調文字<b>や点線の書き方などはこちら↓も
読ませていただきました。
最後に
今回は、はじめてのHTMLとCSSの設置をしてみました！
ちょっとですが、ブログを好みのデザインにできて嬉しいです。
もっとタグの意味を理解して、簡単なHTMLやCSSを作れるようになりたい！という目標もできました！
