在保持响应的同时抵消背景

Question

我正在尝试结合三件事：

• 渐变背景
• 偏移背景
• 背景图片

我基本上想要实现我在下面的JSFiddle中所具有的功能，但无论大小如何都使用渐变跟踪。

https://jsfiddle.net/023hqb6w/

background: linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5)), url("https://c.tadst.com/gfx/750w/sunrise-sunset-sun-calculator.jpg");
background-size: cover;
background-position: 50% calc(50% - 150px);
background-repeat: no-repeat;

我该怎么做？