Hallo zusammen,
wer eine Webseite von Grund auf selber entwickelt hat sich sicher schon einmal über die unterschiedliche Darstellung in verschiedenen Anzeigeprogrammen (Browser) gewundert. Da stimmen bei Browser A z.B. die Abstände von oben bei den margin-Werten, in Browser B sieht man aber noch eine Lücke.
Um die Ansicht auch in verschiedenen Browsern gleich zu bekommen, nutzt man einen sogenannten CSS-Reset. Dasa kann etwas ganz einfaches sein in dem man zum Beispiel nur die margin und padding Werte zurücksetzt. Es können aber auch viele andere Werte zurückgesetzt werden wie euch der Link am Ende dieses Beitrags aufzeigen soll.
Aber ich zeige euch kurz mal die "klassische" Methode eines CSS-Resets mittels Universalselektors.
Mit diesem kurzen Schnipsel in eurer CSS Datei, setzt ihr alle Aussen- und Innenabstände zurück. Das ist eine ganz einfache und schnelle Methode um ein einheitlicheres Aussehen seines Webprojekts zu erreichen. Andere Browserspezifische Einstellungen belieben bei dieser einfachen Methode aber unberührt.
Wer es etwas spezieller haben möchte, kann das ganze auch noch verfeinern und zum Beispiel Eigenschaften für die Überschriften, Formularfelder, Listen etc. vorgeben. Eric Meyer zum Beispiel geht noch einige Schritte weiter und "resettet" noch einige andere Standardeigenschaften. Ihr könnt euch dasa ganze direkt auf der Seite von Erik anschauen unter: https://meyerweb.com/eric/tools/css/reset/
Ob und welche Methode ihr für eure Projekte nutzt bleibt natürlich euch überlassen. Und es gibt natürlich auch noch weitere Beispiele für einen CSS-Reset im Netz. Ich selber nutze meistens die klassische Variante die ich bei Bedarf dann einfach für den jeweiligen Zweck erweitere.
wer eine Webseite von Grund auf selber entwickelt hat sich sicher schon einmal über die unterschiedliche Darstellung in verschiedenen Anzeigeprogrammen (Browser) gewundert. Da stimmen bei Browser A z.B. die Abstände von oben bei den margin-Werten, in Browser B sieht man aber noch eine Lücke.
Um die Ansicht auch in verschiedenen Browsern gleich zu bekommen, nutzt man einen sogenannten CSS-Reset. Dasa kann etwas ganz einfaches sein in dem man zum Beispiel nur die margin und padding Werte zurücksetzt. Es können aber auch viele andere Werte zurückgesetzt werden wie euch der Link am Ende dieses Beitrags aufzeigen soll.
Aber ich zeige euch kurz mal die "klassische" Methode eines CSS-Resets mittels Universalselektors.
Code
* {
margin: 0;
padding: 0;
}
margin: 0;
padding: 0;
}
Mit diesem kurzen Schnipsel in eurer CSS Datei, setzt ihr alle Aussen- und Innenabstände zurück. Das ist eine ganz einfache und schnelle Methode um ein einheitlicheres Aussehen seines Webprojekts zu erreichen. Andere Browserspezifische Einstellungen belieben bei dieser einfachen Methode aber unberührt.
Wer es etwas spezieller haben möchte, kann das ganze auch noch verfeinern und zum Beispiel Eigenschaften für die Überschriften, Formularfelder, Listen etc. vorgeben. Eric Meyer zum Beispiel geht noch einige Schritte weiter und "resettet" noch einige andere Standardeigenschaften. Ihr könnt euch dasa ganze direkt auf der Seite von Erik anschauen unter: https://meyerweb.com/eric/tools/css/reset/
Ob und welche Methode ihr für eure Projekte nutzt bleibt natürlich euch überlassen. Und es gibt natürlich auch noch weitere Beispiele für einen CSS-Reset im Netz. Ich selber nutze meistens die klassische Variante die ich bei Bedarf dann einfach für den jeweiligen Zweck erweitere.