I need to implement a **transparent strikethrought on text with CSS** so I don't have to replace the `<h1>` tag by an `<img>` tag. I have managed to implement a line-through on the text with CSS but I can't make it transparent.

The desired effect : 

![Text with a transprent strikethrought line](https://i.stack.imgur.com/ah9G5.jpg)

What I have :

```css
body{
    background: url(http://lorempixel.com/output/people-q-c-640-480-1.jpg);
    background-size:cover;
}
h1{
    font-family:arial;
    position:relative;
    display:inline-block;
}
h1:after{
    content:'';
    position:absolute;
    width:100%;
    height:2px;
    left:0; top:17px;
    background:#fff;
}
```

```html
<h1>EXAMPLE</h1>
```

How I can I implement the **transparent strikethrought which extrudes my text** and allows the background to appear in this line.