css 实现字幕上下两端虚化效果

在CSS中，要实现字幕上下两端的虚化效果，可以通过使用`linear-gradient`背景配合`text-shadow`来达成这种视觉效果。具体方法是，设置一个渐变的背景，使得文本的上下两端为透明或者半透明，而中间为实色。然后通过`text-shadow`添加模糊效果，增强虚化的感觉。

以下是一个简单的例子，展示如何实现这种效果：

.text-shadow {
  /* 设置文字颜色 */
  color: #fff;
  
  /* 使用线性渐变创建虚化效果 */
  background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.5) 50%, transparent 100%);
  
  /* 设置文本阴影，增加模糊效果 */
  text-shadow: 0px 2px 3px rgba(0, 0, 0, 0.3);
  
  /* 其他样式... */
}

这里，`linear-gradient`创建了一个从上到下的渐变，其中`0%`和`100%`的位置是完全透明的，中间`50%`的位置是半透明的黑色（`rgba(0, 0, 0, 0.5)`）。`text-shadow`则添加了下方阴影，产生模糊效果，让文本的底部看起来像是虚化的。