CSS:背景を蛍光ペンでマークしたようなテキスト装飾

CSSだけでテキストを蛍光ペンでマークしたような装飾を施すことができます。
ランディングページなどでたまにみかけますね。
表示サンプルはこちら

HTML

<div>
    CSS:背景を<span class="markYellow">3/4くらい蛍光ペンでマーク</span>したようなテキスト
</div>
<div>
    CSS:背景を<span class="markYellow2">全部蛍光ペンでマーク</span>したようなテキスト2
</div>

CSS

.markYellow {
    background: linear-gradient(#ffffff 40%, #ffdc19 40%);
}
.markYellow2 {
    background: none repeat scroll 0 0 #ffdc19;
}