Modernes CSS-Reset (Generator)

Modernes CSS-Reset (Generator): wofür es gut ist

Jedes Projekt beginnt mit der Korrektur derselben Dinge: Standardränder, box-sizing, Bilder, die das Layout sprengen, Formularfelder mit anderer Schrift und lange Wörter, die den Bildschirm am Handy zerbrechen.

Kreuze die gewünschten Regeln an und kopiere ein kurzes, kommentiertes Reset, mit box-sizing border-box, Mindesthöhe in dvh, responsiven Medien, font: inherit in Formularen, overflow-wrap, text-wrap balance und pretty bei Titeln und Absätzen, sanftem Scrollen nur für die, die nicht um weniger Bewegung gebeten haben, und dem Abschalten der Animationen für die, die darum gebeten haben.

So geht’s

1. Kreuze die Regeln an, die du nutzen willst.
2. Lies den Kommentar zu jeder.
3. Kopiere oder lade die reset.css herunter und setze sie an den Anfang des CSS.

Wann nutzen

• Eine Website von Grund auf beginnen.
• Projekte im Team vereinheitlichen.
• Verstehen, was jede Reset-Regel tut.

Häufige Fragen

Was ist ein CSS-Reset?

Ein kleiner Satz von Regeln am Anfang des CSS, der störende Unterschiede und Standards der Browser entfernt, wie Ränder am Body, Bilder, die das Layout sprengen, und Formularfelder mit anderer Schrift. Er erleichtert das Schreiben des restlichen CSS.

Reset oder Normalize?

normalize.css bewahrt die Standardstile und behebt nur die Unterschiede zwischen Browsern; ein modernes Reset geht etwas weiter und entfernt, was fast immer überschrieben wird. Die heutigen Browser sind sich viel ähnlicher, daher sind kurze Resets wie dieses am gebräuchlichsten geworden.

Warum steht das sanfte Scrollen in einer Media Query?

Animiertes Scrollen kann bei Menschen mit Bewegungsempfindlichkeit Übelkeit auslösen. In prefers-reduced-motion: no-preference wird es nur für die aktiviert, die im System nicht um weniger Bewegung gebeten haben.

Ist das wirklich kostenlos?

Ja, 100% kostenlos. Ohne Anmeldung, ohne Abo und ohne Nutzungslimit. Alle Tools von Tools123 sind kostenlos.

Ähnliche Tools