Tailwind：使用深色模式更改div的背景梯度

Question

我正在学习顺风，我有这个 div :

<div class="mt-5 border border-gray-300 p-2 bg-gradient-to-b from-gray-100 via-purple-50 to-gray-50 rounded-lg mb-8 p-4 dark:bg-black">

在黑暗模式下，我的背景仍然是原始渐变（我的黑暗模式正在工作）

我想要深色模式下的黑色背景。

我注意到如果我这样做：

<div class="mt-5 border border-gray-300 p-2 bg-gradient-to-b from-gray-100 via-purple-50 to-gray-50 rounded-lg mb-8 p-4 bg-gradient-to-b from-green-200 via-pink-100 to-red-500">

这是使用的第二个渐变（bg-gradient-to-b from-green-200 via-pink-100 to-red-500）。

但是如果我这样做:

<div class="mt-5 border border-gray-300 p-2 bg-gradient-to-b from-gray-100 via-purple-50 to-gray-50 rounded-lg mb-8 p-4 bg-black">

使用的不是 bg-black，而是 bg-gradient-to-b。

所以也许它是链接的:)

Answer 1

为了确保深色模式下的背景颜色为黑色，您可以尝试将

dark:bg-black

类直接添加到您的

div

。

<div class="mt-5 border border-gray-300 p-2 bg-gradient-to-b from-gray-100 via-purple-50 to-gray-50 rounded-lg mb-8 p-4 dark:bg-black">