/* main.css */
@tailwind base;
@tailwind components;
@tailwind utilities;
/* All your tailwind definitions with @apply rules are here */
/* If the user prefers dark mode,
we of course apply color-scheme: dark, as usual */
@media (prefers-color-scheme: dark) {
html {
color-scheme: dark;
}
}
/* If the user prefers light mode,
we still enforce color-scheme: dark, despite the user preference */
@media (prefers-color-scheme: light) {
html {
color-scheme: dark;
}
}
2条答案
按热度按时间soat7uwm1#
请尝试以下操作
在
tailwind.config.css中，将darkMode设置为class当您需要
darkMode时，只需在html标记中添加dark的ClassName当您需要
light时，只需删除html标记内的dark的ClassName希望能有所帮助!
wi3ka0sx2#
我尝试了另一个答案中建议的将
darkMode设置为tailwind.config.js文件中的class的方法，但是尽管采取了所有步骤，这对我来说还是不起作用。在我的情况下，我需要在我的应用程序中强制黑暗模式是调整我的
main.css（又名globals.css或任何其他你叫它）的媒体查询。就是这样，我不需要在我的
tailwind.config.js或其他任何地方浪费时间。