网站/ccs 的复古 CRT 曲面屏幕效果

Question

好吧，所以这不是自我推销！

我目前有一个运行 phpbb 论坛的赛博朋克网站，该网站使用默认的 prosilver 主题，在该主题之上，我有另一个名为 1978 的主题/皮肤，它为网站提供了老式绿色终端的外观。我想做的是创造像旧显示器一样的弯曲外观。我有一个很酷的复古术语，我用它作为我正在寻找的效果的例子。（见图）不是线条或闪烁，而是弯曲的外观，因为我想要的是人们能够按 F11，在浏览器上全屏显示，看起来他们正在旧显示器上使用该网站。

我假设我会在整个身体周围或之后设置一个 div 并给它一个类，然后调用一些 css 也许一些 java <-- 就像我知道那将如何工作..lol 我正在寻找的是一个起点？我在 codepen 上找到了一些东西，但这并不完全是我想要的。

有任何想法吗？？

Answer 1

可以使用SVG过滤器来完成，问题是每次调整页面大小时，都必须更改svg参数。这里做了一个演示。仍在为 Github 进行记录和清理。

https://frindestown.duckdns.org/videomator.html