CSSセレクターでクラスとIDを組み合わせる方法は？

次のdivがある場合：

<div class="sectionA" id="content">
    Lorem Ipsum...
</div>

「id='content'ANDを使用したdiv」というアイデアを表現するスタイルを定義する方法はありclass='myClass'ますか？

または、次のように単にどちらか一方の方法で行っていますか

<div class="content-sectionA">
    Lorem Ipsum...
</div>

または

<div id="content-sectionA">
    Lorem Ipsum...
</div>

スタイルシートで：

div#content.myClass

編集：これらも役立つかもしれません：

div#content.myClass.aSecondClass.aThirdClass /* Won't work in IE6, but valid */
div.firstClass.secondClass /* ditto */

そして、あなたの例ごとに：

div#content.sectionA

編集、4年後：これは非常に古く、人々はそれを見つけ続けているので、セレクターでtagNamesを使用しないでください。tagNameが不要なフィルタリング手順を追加するため、#content.myClassより高速div#content.myClassです。tagNamesは、必要な場合にのみセレクタで使用してください。

css #header .calloutと#header.calloutには違いがあります。

ここに「平易な英語」があります #header .callout：
クラス名を持つすべての要素を選択calloutのIDを持つ要素の子孫でありますheader。

そして #header.callout意味：
のID headerとクラス名を持つ要素を選択しますcallout。

あなたはここでCSSトリックをもっと読むことができます

1つの要素でIDとクラスを組み合わせることに何の問題もありませんが、1つのルールで両方で識別する必要はありません。あなたが本当にしたいなら、次のことができます：

#content.sectionA{some rules}

div他の人が提案したように、IDの前には必要ありません。

一般に、その要素に固有のCSSルールはIDを使用して設定する必要があり、それらはクラスだけのルールよりも大きな重みを持ちます。クラスで指定されるルールは、調整が必要なときにいつでも複数の場所で変更したくない複数のアイテムに適用されるプロパティです。

つまり、これは次のようになります。

 .sectionA{some general rules here}
 #content{specific rules, and overrides for things in .sectionA}

理にかなっていますか？

ええと、idは常に一意であるため、一般的に、idで指定された要素を分類する必要はありませんが、本当に必要な場合は、次のように機能します。

div#content.sectionA {
    /* ... */
}

CSSでIDとクラスを組み合わせることができますが、IDは一意であることが意図されているため、CSSセレクターにクラスを追加すると過剰修飾されます。

使用：tag.id ; tag#classCSSのタグ変数で。

IDはドキュメント全体で一意であることが想定されているため、両方に基づいて選択する必要はありません。要素を複数のクラスに割り当てることができますclass="class1 class2"

私はあなたがすべて間違っていると思います。IDとクラスは特定性の問題ではありません。彼らは完全に異なる論理的用途を持っています。

IDは、ページの特定の部分（ヘッダー、ナビゲーションバー、メイン記事、著者の帰属、フッター）を識別するために使用する必要があります。

ページにスタイルを適用するには、クラスを使用する必要があります。一般的な雑誌サイトがあるとしましょう。サイトのすべてのページには同じ要素（ヘッダー、ナビゲーション、メイン記事、サイドバー、フッター）が含まれます。しかし、あなたの雑誌には、経済学、スポーツ、娯楽など、さまざまなセクションがあります。あなたは、3つのセクションに異なる外観を持たせたいと考えています。

そのためにクラスを使用します。複数のID（＃economics-article、＃sports-article、＃entertainment-article）を作成する必要はありません。それは意味がありません。むしろ、.economics、sports、.entertainmentの3つのクラスを定義してから、それぞれに＃nav、＃article、＃footer IDを定義します。

.sectionA[id='content'] { color : red; }

ただし、doctypeがhtml 4.01の場合は機能しません...