Ich habe mir heute eine CSS-Datei angesehen und den folgenden Regelsatz gefunden:
div.with-some-class {
display:block;
margin:0;
padding:2px 0 0 0;
*padding:1px 0 0 0;
font-size:11px;
font-weight:normal;
*line-height:13px;
color:#3D9AD0;
}Was bedeutet der Stern in * Polsterung und * Linienhöhe?
Vielen Dank.
Antworten:
Dies ist der "Star Property Hack" in der gleichen Richtung wie der "Underscore Hack". Es enthält Junk vor der Eigenschaft, die der IE ignoriert (das * funktioniert bis zum IE 7, das _ bis zum IE 6).
In CSS? Nichts; Es ist ein Fehler.
Aufgrund von Fehlern in einigen Versionen von Internet Explorer wird der ungültige Eigenschaftsname nicht korrekt ignoriert. Dies ist daher eine Möglichkeit, CSS bereitzustellen, das für diese Browser spezifisch ist.
Die Verwendung von bedingten Kommentaren ist jedoch klarer und sicherer.
*vor einer Eigenschaft aussagt. Wenn es eine Bedeutung bekommt, werden sie von aktuellen Browsern ignoriert, sodass die Erweiterung sicher hinzugefügt werden kann. Das ist der Punkt der Regel "muss ignoriert werden".
Das Sternchen ist ein gültiger Platzhalter in CSS. Die alleinige Verwendung bedeutet, dass die folgenden CSS-Eigenschaften für alle Elementknoten im DOM verwendet werden. Beispiel:
*{color:#000;}Die obige Eigenschaft wird auf alle DOM-Elemente angewendet, wodurch die natürliche Kaskadierung in CSS aufgehoben wird. Es kann nur überschrieben werden, indem DOM-Elemente spezifisch markiert werden, wobei für dieses Targeting eine eindeutige Bezeichnerreferenz beginnt. Beispiel:
#uniqueValue div strong{color:#f00;}Die obige Eigenschaft überschreibt den Platzhalter und erstellt den Text aller starken Elemente, die in einem div vorkommen, innerhalb eines Elements mit dem ID-Attributwert "uniqueValue".
Die Verwendung eines universell angewendeten Platzhalters wie im ersten Beispiel kann eine schnelle und schmutzige Methode zum Schreiben eines Reset-Stylesheets sein. Es ist schnell und schmutzig, da eine detaillierte Definition der Präsentation nach dem Platzhalter wahrscheinlich ein extrem aufgeblähtes Stylesheet erzeugt. Wenn Sie den Platzhalter verwenden möchten, würde ich vorschlagen, ihn genauer zu verwenden, z. B.:
* strong{color:#f00;}Im obigen Beispiel wird der Text aller starken Elemente unabhängig von anderen CSS-Eigenschaften, die nicht mit einer eindeutigen Kennung angegeben sind, rot gefärbt. Dies wird als viel sicherer angesehen als die Verwendung der "! Wichtigen" Deklaration, da diese Deklaration bekanntermaßen die natürliche Funktionalität des beabsichtigten Verhaltens beeinträchtigt und ein Alptraum für die Wartung ist.
Die Sternchen in Ihrem Beispiel befinden sich an der falschen Stelle, da sie in den Eigenschaftsdeklarationen, dem Code in geschweiften Klammern, vorkommen und wahrscheinlich einen Fehler verursachen.
Dies ist ein Hack für IE7.
Wenn Sie dies schreiben:
.test {
z-index: 1;
*z-index: 2;
}Auf allen Navigatoren, die den W3C-Standard <div class="test"></div>HTMLElement respektieren, gibt es ein z-index: 1, für IE7 hat dieses Element einz-index: 2 .
Dies ist nicht Standard.
Gehen Sie folgendermaßen vor, um dasselbe mit W3C Standard zu erreichen:
Fügen Sie einen bedingten Internet Explorer-Kommentar hinzu (dies ist ein einfacher HTML-Kommentar für alle anderen Navigatoren, es ist also eine Standardmethode).
<! - [if IE 7]> <html lang = "fr" class = "ie7"> <! [endif] ->
<! - [if gt IE 7]> <! -> <html lang = "fr"> <! - <! [endif] ->
Und verwenden Sie die vorherigen Regeln wie folgt:
.test {
z-index: 1;
}
.ie7 .test {
z-index: 2;
}