使用CSS淡出边框

我有一个页脚，上面有一个虚线边框，如下所示：

footer 
{
    border-top:1px dashed #ddd;
    color:#999;
}

---

我想知道怎样才能使虚线从左到右逐渐消失。谢谢

可能有一个更简单的解决方案，但其中一个是放置一个从左到右逐渐消失的渐变，覆盖边界，例如

footer:before {
    content: "";
    background-color: black;
    height: 1px;
    display: block;
    top: -1px;
    position: relative;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
}

---

您可以使用CSS渐变创建此功能。检查

要使其尽可能简单，请从创建两个div开始：

<div id="borderbox">
    <div id="box">
    </div>
</div>

---

演示：

可能的重复项您可以将虚线添加到它自己的div元素中吗？然后使用CSS3渐变淡出整个div（如果包含边框的元素包含文本，则会导致问题）。Jean Bernard Pellerin，我不确定您的链接问题是否有明确答案。Argh。我太慢了，无法为渐变创建小提琴。此处仅供参考：。另一种方法是使用半透明的png图像背景定位div。我认为这实际上是最好的办法。