文字の後ろに蛍光ペンで書いたようなラインを引く （高さ中央ver）

文字の下に蛍光ペンでアンダーラインを引いたようなCSSはたくさんあるけど、「文字の中央にラインを引く」方法を紹介した記事はないの・・・

どうしたらいいか教えて欲しい。

了解です！

こちらになります↓

SAMPLE

<p><span class="mdbar">文字の後ろに蛍光ペン</span></p>

.mdbar {
	background:url('image/mdbar.jpg') repeat-x;
	background-size: auto 40%;
	background-position:center;
	padding:0 0.3em;
	font-weight:bold;
}

背景画像（mdbar.jpg）