css - 沙漏形发光CSS

Question

我有一个设计师的图片，看起来像这样：

我想让它垂直重复 1px 高度（作为滚动条握把的背景）。有没有办法使用 CSS3 模拟图像中间的发光效果？

问候，

Answer 1

在其上创建另一个 div，具有以下背景：

background-image: linear-gradient(bottom, rgba(255,255,255, 0) 33%, rgba(255,255,255, 0.5) 67%, rgba(255,255,255,0) 100%);

当然，为了有任何用处，应该这样重写：

    background-image: linear-gradient(bottom, rgba(255,255,255, 0) 33%, rgba(255,255,255, 0.5) 67%, rgba(255,255,255,0) 100%);
    background-image: -o-linear-gradient(bottom, rgba(255,255,255, 0) 33%, rgba(255,255,255, 0.5) 67%, rgba(255,255,255,0) 100%);
    background-image: -moz-linear-gradient(bottom, rgba(255,255,255, 0) 33%, rgba(255,255,255, 0.5) 67%, rgba(255,255,255,0) 100%);
    background-image: -webkit-linear-gradient(bottom, rgba(255,255,255, 0) 33%, rgba(255,255,255, 0.5) 67%, rgba(255,255,255,0) 100%);
    background-image: -ms-linear-gradient(bottom, rgba(255,255,255, 0) 33%, rgba(255,255,255, 0.5) 67%, rgba(255,255,255,0) 100%);