javascript - 向页面底部淡出效果

Question

发现这个非常酷的网站。 http://selectize.github.io/selectize.js/试图弄清楚他们是如何利用页面底部的不透明度来产生这种淡化效果的。

正在查找这篇文章，发现这篇文章是通过叠加图像来实现的。

https://css-tricks.com/css-trick-fade-out-the-bottom-of-pages-with-a-fixed-position-image/

但是如果您看到选择页面，他们使用了一种不使用图像文件的更简洁的方法。

有人知道吗？任何帮助将不胜感激希望在我的元素中使用它

谢谢

Answer 1

该页面似乎使用 box-shadow: 0 -1px 80px 80px rgba(255, 255, 255, 0.6); 下面看到的 css 属性 div 元素(固定在以 Themes: default.... 开头的底部)，其 ID 为 theme-selector

快速复制@ jsFiddle

如果这是您第一次遇到 box-shadow 那么您可能想阅读它是什么:http://www.w3schools.com/cssref/css3_pr_box-shadow.asp