CSS: Kann ich jeden Elementtyp auswählen, der nicht zu einer bestimmten Klasse gehört?

Let sagen, dass ich diese Seite bekam:CSS: Kann ich jeden Elementtyp auswählen, der nicht zu einer bestimmten Klasse gehört?

<body> 
    <h1>Hello!</h1> 
    <div class="wrapper"> 
     <div class="anotherclass"> 
      <h1>Another heading 1</h1> 
     </div> 
     <div class="yetanotherclass"> 
      <h1>Yet another heading 1</h1> 
     </div> 
    </div> 
    <h1>Good bye!</h1> 
    <div class="class"> 
     <h1>Good bye. And this time I mean it.</h1> 
    </div> 
</body>

Und ich möchte alle H1 Elemente auszuwählen, die nicht innerhalb der wrapper -Klasse sind. Wie kann ich das mit CSS machen? Ich will nicht eine „Lösung“ wie

body h1, body .class h1 {style definitions}

Ich bin mehr nach irgendeiner Art von diesem:

h1:not(.wrapper > h1) {style definitions}

Gibt es eine Möglichkeit, dies zu tun?

Quelle

2009-06-17 Zyberzero

Was ist, wenn Sie so etwas wie dies tun:

h1 { /* rules for everything without the class */ } 
h1.class { /* rules for everything with the class */ }

In h1.class würden Sie alles außer Kraft setzen, die Sie in Ihrer h1 Regel definiert. Hier

ein Beispiel:

<html> 
    <head> 
     <style type="text/css"> 
       div { color:#00f; } 
       div.foo { color:#f00; } 
     </style> 
    </head> 
    <body> 
     <div class="foo">foo</div> 
     <div>bar</div> 
     <div>baz</div> 
    </body> 
</html>

In diesem Beispiel habe ich effektiv alle divs gezielt, die keine Klasse von foo haben.

Quelle

2009-06-17 19:35:40

Das mit meiner aktuellen Lösung nicht möglich ist. Ich kann den HTML-Code nicht ändern, da er mit einem Javascript von einem externen Server geladen ist, sodass ich keine Klasse für die Überschriften festlegen kann. – Zyberzero

Ich habe meine Antwort bearbeitet, um die Klassen des Beispiels zu entfernen. Sie müssen den HTML-Code überhaupt nicht ändern, da die erste Regel den Stil für _all_ Elemente definiert und die zweite Regel nur für den mit der Klasse gilt, die Sie ausschließen möchten. –

-1

Sie können den Universal-Selektor * globalen Styling anwenden und dann einen verschachtelten Universalselektor anwenden: .wrapper * das Styling ursprünglich

* {font-weight:bold; border:thin solid red;} 

.wrapper * {font-weight:normal; border: 0px solid white;}

Quelle

2009-06-17 19:39:30

Die Sache ist, ich werde diese Selektor-Sache als Eingabe für ein Javascript verwenden, die Art von Css-Selektoren versteht - aber nicht diese verschachtelten Varianten. Es muss ein "One-Row" -Ding sein – Zyberzero

"Art von versteht Css-Selektoren" schlägt jQuery vor. Sie können Klassen, Zieleltern usw. in jQuery hinzufügen. –

Es ist eigentlich eine sIFR-Implementierung, die ich in Kombination mit einem Rich-Text-Editor mache. Der Rich-Text-Editor befindet sich in einem bestimmten Div, das Elemente vom Typ h2 und h3 enthält und für die ich nicht möchte, dass sIFR den Text ersetzt, sondern jedes andere vorkommende Element dieses Typs. – Zyberzero

Sie können nicht angewendet rückgängig zu machen, was Sie fragen mit CSS. Die ganze Idee rund um CSS ist die Kaskade, und was Sie tun möchten, ist gegen den Fluss der Kaskade arbeiten.

Arbeit mit den Gezeiten zu tun regelmäßige CSS:

h1 {style definitions} 
.wrapper h1 {style definitions}

Quelle

2009-06-17 20:20:12

CSS: Kann ich jeden Elementtyp auswählen, der nicht zu einer bestimmten Klasse gehört?

Antwort

Verwandte Themen