border-imageをbefore,after擬似要素で使うとRetina対応もできて便利 - develo.orgボックスの周りに装飾として画像を置きたい場合に背景画像で対応するのもいいのですが 3つに切って・・。真ん中を繰り返しして・・。 さらに透過だった場合どこのタグに背景をいれるか工夫したりするのが大変だなぁと思っていました。 そういう場合はborder-imageを使ったりしていたのですが border-imageを使うとborder-width分コンテンツが内側によっちゃいますよね・・。 まぁborderなので当たり前ですが・・。 しかも普通にやると画像だけ1/2にすることができないので、Retina対応とかできないんです。 でもこれafterとかbeforeに指定したらborder-widthとか気にせずに使えるんじゃない！？ と思って試してみたらめちゃめちゃ便利！しかもRetina対応もできちゃうし！ みなさんも是非使ってみてくださいｗ
