背景画像を9スライスで表現するには、以前はDOMとCSSを駆使していましたが、CSS3の border-image を使うことでDOMを増やすことなく9スライス背景画像を使えるようになっていました。 とっても便利すぎたので、メモ。
ツールもあります。
こちらのサイトでは、指定した画像を9スライスしたCSSを簡単に作成することができます。
http://border-image.com/
あと、できたCSSに追加で下記も含めると幸せになりそうです。
box-sizing: content-box;
他にも下記のような指定で、さらに外側に border-image を表示することも可能です。
border-image-outset: 50px 30px 60px !important;