Wie lautet die CSS-Syntax für eine benannte span-Klasse, die in einem div verschachtelt ist?

Question

Wie referenziere ich im Folgenden die Klasse "name"?

<div class="resultDetails">
<span class="name">Name</span>
<span class="address">Address</span>
</div>

Answer 1

div span.name { ... }

div gibt den Elementtyp an

ein Leerzeichen dann span teilt mit, dass die Spannelemente in den Unterebenen betrachtet werden sollen

.name sagt, dass man sich die Elemente mit der css-Klasse name

Answer 2

Einfach

<style>
.name
{

}
</style>

Alles, was Sie brauchen, ist der Name der Klasse selbst, sofern keine anderen Faktoren Ansonsten können Sie verschiedene Arten von Selektoren verwenden

div span.name // selects all spans with class "name" in any div
div > span.name // this one selects only the spans that are direct children of a div
div.resultDetails span.name //select only spans with class "name" in only divs with class="result Details
.resultDetails .name // selects any element with class "name" in any element with class "resultDetails" 

Es gibt noch mehr Möglichkeiten der Auswahl, aber Sie verstehen, worauf es ankommt.

Answer 3

div.resultDetails > span.name { ... }

Sollte funktionieren.

Answer 4

Div.resultDetails > span.name funktioniert in den meisten Browsern.

Im IE6 funktioniert es jedoch nicht. Wenn das ein Problem ist, verwenden Sie einfach: div.resultDetails span.name {} sollte die span korrekt ausrichten (vorausgesetzt, Sie haben keine verschachtelten span.name-Elemente innerhalb der div, die Sie nicht ausrichten wollen).