在 box-shadow 之后使背景透明答案

【问题标题】：Make background transparent after box-shadow在 box-shadow 之后使背景透明
【发布时间】：2021-03-08 13:16:14
【问题描述】：

我想在悬停元素后移除背景，（使其透明）

基本上让阴影覆盖白色背景。我尝试将背景设置为无、透明、移除边框和轮廓，但没有任何效果。

a {
  color: rgb(220, 20, 120);
  text-decoration: none;
  border: none;
}

a:hover {
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.4);
}

&lt;a href="#"&gt;CLICK ME&lt;/a&gt;

【问题讨论】：

标签： css

【解决方案1】：

a {
  color: rgb(220, 20, 120);
  text-decoration: none;
  border: none;
}

a:hover {
  text-shadow: 2px 4px 8px rgba(0, 0, 0, 0.9);
}

&lt;a href="#"&gt;CLICK ME&lt;/a&gt;

【讨论】：

谢谢，在我将此标记为答案之前，这是确切的 RGB 属性吗？
不客气！您可以以任何格式指定任何颜色，即使是您使用 rgba(0, 0, 0, 0.4) 或 rgb(220 20 120) 或 #db1478 的格式。如你所愿 =)

【解决方案2】：

a {
  color: rgb(220, 20, 120);
  text-decoration: none;
  border: none;
  transition: all 0.5s ease; // FOR SMOOTH HOVER EFFECT
}

a:hover {
  text-shadow: 0 8px 16px rgba(0, 0, 0, 0.8);
}

&lt;a href="#"&gt;CLICK ME&lt;/a&gt;

【讨论】：