Globale CSS-Dateien enthalten typischerweise Elemente wie Layout, Typografie und andere konsistente Designmuster über verschiedene Teile der Anwendung hinweg.

Wenn Sie zum Ordner app/ui navigieren, finden Sie eine Datei namens global.css. Diese Datei ermöglicht es Ihnen, CSS-Regeln auf alle Routen in Ihrer App anzuwenden. Obwohl Sie global.css in jeder Komponente einbinden können, wird empfohlen, es im Root-Layout (app/layout.tsx), der Hauptkomponente der App, einzubinden.

Lassen Sie uns die globalen Stile zur App hinzufügen. Gehen Sie zu app/layout.tsx und importieren Sie die Datei global.css.

Nach dem Einbinden der globalen Styles sollten Sie die folgende Ansicht sehen, wenn der lokale Entwicklungsserver noch läuft: http://localhost:3000/

In der Praxis