spanを使いこなしたい

spanを全然使ってこなかった私。
じゃあ何を使ってたかというと、、divです^^
こりゃまた使い勝手が良かったんです。
コードを調べるとき常にdivが出てたんですね。
spanなんてなんだろうとだけ思って放置してました^^

いつ使うの？

じゃあいつ使うのってなるんですけど。
私がめっちゃええやん！！って思って使ったやつ。

改行したくないけどcssは違う時

私が使ってみた例を紹介します。（誰得）

レビュー機能を作ろうと思ったんです。
★★★★★←これね

大体レビューのやつって例えば★５のうち★４だと、星４つは黄色で星１つは灰色で色がついてませんよみたいな表示の仕方ですよね。

こんな感じ。

これを作ろうと思ってまず星の個数はレビューをしてもらった時にもらう数値で４つ表示させるんですよね。そして残りの数を灰色で表示したいんです。

黄色の星と灰色の星で色が違うのでコードを分けなきゃいけないですよね。多分。
idとかでcssに繋いでcolorをそれぞれの色で指定するんですけど、
いつも通りdivでやろうとしたけどだけどだけど、、

あれ、、、divで区切ったら改行されるよね、、、って。

divとspanの違いはブロック要素かインライン要素かの違いらしいです。
私まだ理解してないから説明はまた今度。

そのとき調べたらなんとspanという救世主がいたんですね。
spanはインライン要素なのでspanの前後に改行が入らないんですって！！！！
はあ～まいりましたね。新しい発見をしました。

divと同じようにidやclassを付けてcssとつなげることができます！

divのように何でもできるわけじゃない

なんか制限があるらしいです。
そこはまだ調べてないのでのちのち更新します。てへ。