CSSドキュメントのIDとクラスを理解していると思いました。私の知る限り、html ドキュメントには id 要素のインスタンスが 1 つだけ存在し、多くのクラス要素が存在するはずです。現在、すべての新しい mvc3 プロジェクトで生成される Microsoft 主導の Site.css テンプレートを調べていますが、 #page ではなく .page 要素があることがわかります。ここで何か不足していますか?
4 に答える
JavaScript には ID のみを使用し、CSS にはクラスのみを使用することが一般的になりました。
これにはいくつかの理由があります。
- JS を使用した ID の選択は非常に高速です
- ID はクラスよりも特異性が高い
- JS と CSS を分割する便利な方法です。
例として:
<a class='btn btn-primary' id='alert' href='#'>Click Me</a>
btn
およびbtn-primary
クラスが CSS に使用される典型的な使用方法ですが、 alert
id は JS で使用されます。
つまり、JS リンクを失うことなくリンクのスタイルを変更でき、スタイルを変更せずに動作を変更できます。
クラスを使用すると、適切なカスケードを維持するのが簡単になります。Id は、スタイルをドキュメントにリンクするための非常に具体的な方法です。また、現時点では要素が 1 つしかない可能性があるため、id を使用する方法のように思えるかもしれませんが、近い将来に 2 つに切り替える場合はどうなるでしょうか。
開発者は通常#id
、その要素に何らかの JavaScript を適用する場合に使用します。ID は一意である必要があります。ID は.whatever
複数回使用できるクラスです。
あなたが言ったように
マイクロソフトは.page
、複数のものに適用する必要があるため、使用している可能性があります。使用していないだけです。#page
実際には違いはありません。#id
.class
Microsoft 主導の Site.css テンプレートをまったく知りません。しかし率直に言って、彼らから CSS に関するアドバイスは受けません。彼らのブラウザーは、スタイリングに関して国際標準を採用するという点で、すべての主要なブラウザーの中で一貫して最悪でした。
特定のページの特定のアイテムの ID は 1 つだけにする必要があります。しかし、少なくともスタイリングのためには、少なくとも1つ以上が機能することはほぼ確実です(スクリプトで試してみてください:p)。
マイクロソフトのホームページを w3c に挿入したところです。
html バリデーター: 28 個のエラー、581 個の警告
および w3c CSS バリデーター
次のエラーが見つかりました (68)
間違いなく多くの CSS エラーは、設計の悪いブラウザー (主に Microsoft のブラウザー) の問題を修正するために設計された、許容範囲内のハックによって生成される可能性があります。
それでも、このマイクロソフト主導の Site.css テンプレートには興味があります。リンクを投稿していただけませんか?
補足として: CSS の ID は、順序に関係なく、常にクラスよりも優先されます。