我正试图使用顺风为我的Nuxt 3应用程序创建一个自定义404错误页面。
我想页面填充与404垂直和水平居中的所有设备上的屏幕，但我不能让它垂直居中。它总是在页面的顶部，即使我在 Package <div>中使用h-screen或h-full。
在Tailwind UI组件中的此类页面的示例中，它说“* 此示例需要更新您的模板 *”：
<html class="h-full">
<body class="h-full">字符串
如何在Nuxt 3中为特定的page.vue轻松添加tailwind类到html和body标签？
我尝试在page.vue中添加以下内容：
<script setup>
useHead({
htmlAttrs: {
style: 'html: h-full'
},
bodyAttrs: {
style: 'body: h-full'
}
})
</script>
<style>
html,
body {
margin: 0;
padding: 0;
}
</style>型
1条答案
按热度按时间e5nqia271#
试试这个
关于
useHead可组合文档。bodyAttrs参数这将有助于您在body标记中添加任何自定义类。如果你想在HTML上添加一个类，你可以使用htmlAttrs参数。https://nuxt.com/docs/api/composables/use-head#usehead字符串
下面是一个工作示例。希望对你有帮助https://stackblitz.com/edit/nuxt-starter-ts3sbx?file=pages%2Findex.vue