Q&A
回答にも書きましたが、命名規則、というジャンルの話になると思うので、
質問タグに、追加されるといいかと思います。
質問は編集できます。
CSSではワイルドカード指定ができます。
（１）つなげてしまう。
class="register_top"
class="register_bottom"
class="check_top"
class="check_bottom"
（２）クラスをパーツ化する。
class="register top"
class="register bottom"
class="check top"
class="check bottom"
（１）の場合CSSは
CSS
1[class^="register"]{ 2 3} 4[class$="top"]{ 5 6} 7[class^="check"][class$="bottom"]{ 8 9}
などとなります。（２）の場合は
CSS
1.register{ 2 3} 4.check{ 5 6} 7.top{ 8 9} 10.bottom{ 11 12} 13
となります。
どちらのほうが良いでしょうか？デメリット、メリットなどありましたら教えていただけますと幸いです。
回答2件
0
これは、コーディング規約と、呼ばれるもので
複数人で開発しても、変数の書き方に統一性がなくなるものを無くし
ひとめで、意味を読み解けるようにするものです。
複数人で開発する際にコーディング規約は意味をなしますが
一人で開発するのであれば、自分でこの変数の意味なんだっけ？
とならないように、しておけばよいだけのことなので、
さほど、気にされなくても良いかとおもいます。
投稿2020/01/27 04:59
編集2020/01/27 05:00
総合スコア1015
横からなのですが、本件を見て疑問に思ったのですが、セレクターと波括弧の前には空白を開ける事って推奨などされてましたっけ?
空白を入れない場合
.check{}
空白を入れる場合
.check {}
横槍すみません。
最後のセレクタに関しては空白は特に必要でないですし、非推奨とかもありません。
（圧縮したら除去されますし）
EclipseIDEでフォーマットすると空白ができますよ。
それは、Eclipseの場合はであって、
（それも設定によって変わる）だいたいの圧縮ではそこの部分の空白は除去されます。
勉強になりました。ありがとうございます
0
ベストアンサー
質問に対してドストレートに回答すると、
要件によって変わるからなんとも言えないなのですが、（ようはチーム内での決め事や、個人でやってるなら、オレオレルールでもいいということです。また、CSSの解釈の仕方が違い、レンダリング速度に若干の影響を及ぼす可能性はある）こういった、変数や、CSSでいうクラスやIDの名称に関しては、
命名規則というジャンルの話になりますので、
CSS 命名規則 などのキーワードで調査されると、参考になる記事がたくさんでてくると思いますよ。
teratailでも、
CSS 命名規則に関連する質問・回答の検索結果(1ページ目)｜teratail
と、何度も様々な角度で質問がされているようですね。
投稿2020/01/27 04:23
総合スコア9528
あなたの回答
tips
プレビュー
