CSSで９パッチ(9スライス)をする方法 | Nega Universeリキッドレイアウトやマルチデバイス対応を行なうための重要なテクニックの１つ、「9パッチ(9スライス)」をCSSで行なう方法を紹介したいと思います。 アプリ開発やFlashでは「9Patch」「9Slice」という名前のこの機能、つまり角丸ボタンなどの画像を縦横に拡大させても角丸が変形しないアレです。 以前のHTML/CSSでは画像を分割して拡大に対応する方法がありましたが、CSS3では最小の画像１つで実現することができます。 CSS3では「border-image」を使う CSSで9パッチを行なう場合、CSS3の「border-image」プロパティを使います。 border-imageプロパティはその名のとおり、ボーダーに画像を使うことのできるプロパティですが、実はこれがCSSの9パッチなんです。 border-imageプロパティにはborder-image-source、bord
