例えば、<h3>のブロック要素に囲まれた文字列に画像を使った下線を引きたい場合、そのまま直接<h3>にスタイルシートで下部分のみに背景画像を表示させるようにすると、その<h3>に指定したwidth分いっぱいにラインが引かれてしまいますよね？

文字列の部分だけに引きたいのですが、その場合に適切というか、スマートなのは、

1) <h3>内の文字列を<span>で囲んで、<span>にCSSで同じように装飾をほどこす
2) <h3>をdisplayでinline要素に変えてしまって、同じように装飾をほどこす

のどっちなんでしょうか？
<h3>は見出しという意味をつけるということで、無理やりinline要素に変えてしまうのは良くないのかなと思って…
下らない質問ですみません。他にいい方法があれば教えて頂けると嬉しいです