1. ホーム
  2. ハイパーリンク

[解決済み】html/cssのidとclassの標準的な命名規則は何ですか?[クローズド]

2022-03-26 15:18:52

質問

使用しているプラットフォームに依存するのでしょうか、それともほとんどの開発者が提案/遵守している共通の慣習があるのでしょうか?

いくつかの選択肢があります。

  1. id="someIdentifier"' - は、javascriptのコードとかなり整合性があるように見えます。
  2. id="some-identifier" - は、html5的な属性などの方が、htmlの中にあるような気がします。
  3. id="some_identifier" - は、rubyのコードとかなり整合性があり、Javascriptの内部ではまだ有効な識別子です。

私は、上記の#1および#3が、Javascriptとよりうまく動作するため、最も理にかなっていると考えていました。

これに対する正解はあるのでしょうか?

どのように解決するのですか?

ないんです。

ハイフンは私のテキストエディタ(Gedit)のシンタックスハイライトを混乱させるため、私はいつもアンダースコアを使用していますが、これは個人的な好みの問題です。

これらの規約はすべて、あちこちで使われているのを見たことがあります。自分にとって一番見やすく、読みやすいもの、また何度も使うものなので打ちやすいものを選んでください。例えば、アンダースコアのキーがキーボードの裏側にある場合は(可能性は低いですが)、ハイフンを使用することになります。自分にとってベストなものを選んでください。また、これらの3つの表記はいずれも読みやすいものです。チームで作業している場合は、チームで指定された規則に従ってください(もしあれば)。

2012年更新

私はプログラミングの方法を変えてきました。今はキャメルケース( thisIsASelector ハイフンの代わりに、"H "を使うようになりました。どんなものでも あなた というのは、時間の経過とともに変化しやすいからです。

2013年更新

年がら年中、混ぜるのが好きなようです...。Sublime Textに変えてからしばらくBootstrapを使っていましたが、またダッシュに戻りました。今の私には、un_der_scoreやcamelCaseよりもずっとすっきりした印象です。 しかし、私の最初の指摘はまだ有効です。 はありません。 標準的なものです。

2015年更新

ここで規約のある面白いコーナーケースは サビ . 私はこの言語をとても気に入っていますが、コンパイラーは underscore_case . この警告は消すこともできますが、コンパイラがデフォルトで慣習を強く示唆するのは面白いですね。大規模なプロジェクトでは、よりクリーンなコードになることは間違いないでしょう。

2016年更新 ( あなた を要求した)

を採用しました。 BEM 今後、私のプロジェクトでは、この規格を使用します。クラス名はかなり冗長になってしまいますが、クラスとそれに付随するCSSに良い構造と再利用性を与えていると思います。私は、BEM は、実は を標準とする(だから私の noyes おそらく)でも、プロジェクトで何を使うかは、あなた次第です。最も重要なことは、選んだものに一貫性を持たせることです。

2019年更新 ( あなた を要求した)

かなり長い間、CSSを全く書かなかった私が、あるところで仕事をするようになり、その中で OOCSS を、ある製品で使っています。個人的には、至る所にクラスを散らかすのはかなり不愉快ですが、HTMLとCSSを常に行き来する必要がないのは、かなり生産的な感じがします。

でも、やっぱりBEMに落ち着きますね。冗長ですが、名前空間があるため、Reactコンポーネントでの作業が非常に自然です。また、ブラウザテストで特定の要素を選択するのにも最適です。

OOCSSとBEMは、世の中にあるCSS標準の一部に過ぎません。自分に合うものを選びましょう。どれも妥協の連続です。 は、それほど良いものではありません。 .

2020年のアップデート

今年はつまらない更新です。まだBEMを使っています。私の立場は、上記の理由で2019年のアップデートからあまり変わっていません。チームの規模に合わせてスケールし、CSSの貧弱な機能セットを好きなだけ、あるいは少しも隠さない、自分に合ったものを使いましょう。