どうも！LSSです！！
今回はCSS小ネタです！
よくブログで見かけると思いますが、こんな風に文字に背景色をつけるやり方、皆さんされていますが、
「はてなブログの『記事を書く』画面でお手軽に文字に背景色をつける方法」
を、今日はネタにしてみます^^
はてなブログ「記事を書く」画面にて
まずは普通に文章を書きます
↑おなじみ、はてなブログの「編集 見たまま」画面ですね。
次に「編集 見たまま」画面の機能で、文字に色をつけます
色をつけたい文章を選択してから、
↑ここをクリックして色を選んで…
↑こんな風に文字に色がつきますね。
ここまでは直感的にできる事なので、皆さんされている事かと思います。
文字につけた色を、文字の背景の色に変えてしまう方法！
ここからが今回の記事のメインになります！
背景色にしたい色を、文字につけるところまでやった状態で「HTML編集」画面に切り替えます！！
↑こういう画面が出てきます。
で、「さっき文字の色を変えた部分」を探してください。
<span style="color: #f5a2a2;">こんな風に文字に背景色をつける</span>
↑こういう風に<span>タグで囲まれています。
「"」と「color:」の間にカーソルを合わせます
そして、「color:」の前に
background-
と入力します！
画面でいうと
↑こんな感じ。
スペルミスにご注意ください。
（恥ずかしながら自分は何度かnを入れ忘れたりしちゃいます^^;;;;;;。）
<span style="background-color: #f5a2a2;">こんな風に文字に背景色をつける</span>
↑こういうコードになりますね。
そして「編集 見たまま」画面に戻ると…
↑このように、文字につけていた色が解除され、背景色としてその色が使われる事になります^^
再度、「編集 見たまま」画面で文字にも別の色をつける事もできますよ。
以上です！
「HTML編集画面でbackground-を入れるだけ」で文字色を文字背景色に変える方法でした。
