title: How to get scanlines over background image in CSS
body: <p>I have a full-page background image that I'd like to overlay scanlines over. I'm wanting to replicate the more traditional diagonal scanline effects that I grew up seeing in digital art of the noughties, such as implemented <a href="https://mdbootstrap.com/docs/jquery/css/masks/" rel="nofollow noreferrer">here</a> in Bootstrap's pattern mask 5:</p>
  
  <p><a href="https://i.stack.imgur.com/KndXB.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/KndXB.png" alt="enter image description here"></a></p>
  
  <p>I've seen a few tutorials for diagonal scanlines, but haven't been able to find anything like this. How would I accomplish it in CSS?</p>