3 Stimmen

Gültiges CSS oder Hack?

Setzen Sie dies an den Anfang Ihrer CSS-Datei:

* { margin: 0; padding: 0; }  

hack? oder gültiges CSS? Was macht es? und wie portabel auf verschiedene Browser/Versionen?

25voto

TJ L Punkte 22920

Dies ist gültiges CSS. Es wählt JEDES Element aus und setzt die Standardränder und -auffüllungen zurück. Der Grund dafür ist, dass das Layout der Website in verschiedenen Browsern/Versionen konsistent sein soll, da jeder Browser sein eigenes Standard-Stylesheet hat. Wenn Sie diese Deklaration nicht verwenden oder keinen Rand/Padding für jedes Element angeben, verwendet jeder Browser seine eigenen Standardränder/Paddings für dieses Element, und die Seite wird in verschiedenen Browsern uneinheitlich dargestellt.

6voto

TStamper Punkte 29478

Nach Angaben von http://css-tricks.com/margin-0-padding-0-no-longer-cool/

Dies ist Teil der "CSS-Reset"-Theorie, die alle Unterschiede in Polsterung und Rand zwischen den Browsern beseitigt. Es ist sehr schwer für den Rendering-Agenten, Regeln auf jedes einzelne Element im Dokument anzuwenden, vor allem bei großen Webseiten, und dies kann auch eine Menge guter Standard-Styling zerstören, vor allem, wenn Sie standardmäßig gestylten Submit-Buttons haben wollen.

2voto

Noldorin Punkte 138548

Der Stern ist bekannt als der Universalwähler und ist gültiges CSS. Alles, was es tut, ist die Anwendung der Stile auf todos Elemente auf der Seite. Er sollte jedoch mit Bedacht eingesetzt werden. Ich persönlich habe keine große Verwendung dafür gefunden. Das Zurücksetzen der Ränder und Abstände aller Elemente ist etwas, das Sie gezielter (und meiner Meinung nach besser) mit anderen Elementen, Elementgruppen und Klassen durchführen können.

Voir diese Seite für Details zur Browserunterstützung. (Beachten Sie, dass das Dokument im Jahr 2000 geschrieben wurde und daher veraltet ist; ich könnte mir vorstellen, dass Sie heutzutage volle Unterstützung in allen gängigen Browsern erwarten können).

Der universelle Selektor Internet Explorer 5.x sowohl für Windows und Macint Mac, und auch in Opera 3.6. Er wird auch in der Netscape 6 Vorschau unterstützt Release 1 auf all den unzähligen Plattformen für die es verfügbar ist, und in Preview Release 3 von Opera 4 für Windows.

1voto

Wesley Punkte 10357

Dies ist:

  • Gültige CSS
  • Nicht wirklich ein "Hacker"
  • Ein bisschen kompliziert
  • Wahrscheinlich ist es sowieso nicht das, was Sie wollen.

* ist der Universalselektor. Im CSS-Spezifikation hat der Universalselektor eine Spezifität von 0000, was bedeutet, dass jeder andere Selektor einen höheren Vorrang hat. Dies ist also eine Möglichkeit, alle Ränder auf eine Weise "zurückzusetzen", die von jeder anderen Regel außer Kraft gesetzt werden kann.

Bedenken Sie, dass Ihre Listen dadurch unübersichtlich werden würden. Ohne Ränder und Auffüllungen sind die Listenelemente nicht mehr eingerückt. Einige Regeln sind insofern von Vorteil, als sie Dinge gestalten, die normalerweise nicht als gestaltungsbedürftig gelten.

Der Universalselektor wählt jedes einzelne Element auf der Seite aus. Jedes kleine div jede Kleinigkeit li , und so weiter. Es werden sogar Dinge ausgewählt, die keine Block-Level-Elemente sind, wie a y span y head . In vielen Fällen ist dies ein Overkill und kann bei großen Seiten ziemlich ineffizient sein.

Wenn Sie nach einer Möglichkeit suchen, das Standard-Styling von HTML zurückzusetzen, verwenden Sie besser etwas wie Eric Meyers CSS zurücksetzen . Das CSS-Stylesheet "Zurücksetzen" ist zwar viel komplexer, aber es geht nicht so weit, dass jedes einzelne Element ausgewählt wird. Andernfalls löschen Sie einfach den Rand und das Padding jedes einzelnen Elements, das Sie stört. (Ich entferne immer das Padding und den Margin von body y h1 sobald ich mit einer Seite beginne).

1voto

Dave Everitt Punkte 15928

Das sieht man manchmal:

html * { margin: 0; padding: 0; }

oder

body * { margin: 0; padding: 0; }

die in verschiedenen Browsern zu leicht unterschiedlichen Ergebnissen führen. Nur etwas, das man beachten sollte.

Es gibt auch selektive Zurücksetzungen, die nicht jedes HTML-Element einschließen - siehe diesen Artikel Vergleich der Arten von CSS-Reset .

Das kann kein Hack sein, denn es handelt sich um gültiges und standardmäßiges CSS.

CodeJaeger.com

CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.

Powered by:

X