Wie man verschiedene Arten auf zwei identische <cite> Elemente setzt?

Question

Ich habe diese

<p> 
    <cite>One</cite><cite>Two</cite> 
</p> 

ist es eine Möglichkeit, in CSS zu sagen, dass der erste fett und die zweite kursiv sein zitieren wird, ohne Bearbeitung der oben genannten Code?

Answer 1

Mit CSS3, sollten Sie in der Lage sein, dies mit der folgenden Art zu erreichen:

cite:nth-child(1) { font-weight: bold; } 
cite:nth-child(2) { font-style: italic; } 

CSS3 ziemlich schlecht im Moment unterstützt wird, so überprüfen Sie den Browser Sie sich entscheiden, zu unterstützen.

Answer 2

Sie könnten den: First-Child-Pseudo-Selektor verwenden, obwohl er nicht browserfreundlich ist.

p cite:first-child { font-weight: bold; font-style: normal; } 
cite { font-style: italics; } 

Answer 3

p > cite { font-weight: bold } 
p > cite + cite { font-style: italic } 

Aber Vorsicht, dass es nicht in IE6 funktioniert. Vielleicht möchten Sie mit jquery css3-Regeln in ie6 anwenden. Es gibt auch ein Skript namens IE7, aber es ist ein bisschen langsam.

Answer 4

Es gibt Möglichkeiten, dies mit CSS zu tun, aber es wird nicht mit IE6 kompatibel sein. Solange Sie mit, dass in Ordnung sind, können Sie dies tun:

p cite { 
    font-weight: bold; 
} 

p cite + cite { 
    font-style: italic; 
    font-weight: normal; 
} 

Der Grund dies funktioniert, ist, weil ‚+‘ die Geschwister irgend zitieren gegeben auswählt. Da Geschwisterbeziehungen im DOM nur vorwärts gehen, wählen Sie nur das zweite (oder n-te, wo n> 1) Cite-Tag.

Leider + funktioniert nicht mit IE6.

Answer 5

p cite:first-child { 
    font-weight: bold; 
} 
p cite:last-child { 
    font-style: italic; 
}