Wie füge ich die CSS-Klasse Tailwind für die Tags <html> und <body> in Nuxt 3 hinzu?
<p>Ich versuche, mithilfe von Tailwind eine benutzerdefinierte 404-Fehlerseite für meine Nuxt 3-Anwendung zu erstellen. </p>
<p>Ich möchte, dass die Seite den Bildschirm auf allen Geräten ausfüllt und die 404-Fehlerseite vertikal und horizontal zentriert wird, aber ich kann sie nicht vertikal zentrieren. Auch wenn „h-screen“ oder „h-full“ in einem umschlossenen <div> verwendet wird, befindet es sich immer oben auf der Seite. </p>
<p>In einem Beispiel in der Tailwind-UI-Komponente heißt es: „Dieses Beispiel erfordert eine Aktualisierung Ihrer Vorlage“: </p>
<pre class="brush:php;toolbar:false;"><html class="h-full">
<body class="h-full"></pre>
<p>Wie füge ich in Nuxt 3 ganz einfach die Tailwind-Klasse zu HTML- und Body-Tags in einer bestimmten page.vue hinzu? </p>
<p>Ich habe versucht, Folgendes zu page.vue hinzuzufügen: </p>
<pre class="brush:php;toolbar:false;"><script setup>
useHead({
htmlAttrs: {
Stil: 'html: h-full'
},
bodyAttrs: {
Stil: 'Körper: h-voll'
}
})
</script>
<Stil>
html,
Körper {
Rand: 0;
Polsterung: 0;
}
</style></pre></p>