角と罫線を分割する機能を追加するテクニック：CSS3複数の背景や枠線画像？

Question

私はコンテンツのコーナーやボーダーに素敵な花を添えて既存のウェブサイトを「装飾」しています。divマークアップを一切変更することなく（CMSによって生成されるので）、CSSを使用するだけで華麗な画像（すなわちcorner flourishes like this）と飾り枠をどのように追加できますか？

私が達成したいもののファンシーASCIIアート表現（外側の境界は、div要素を表します）：

--------------------------------------------- 
|           | 
| #%%%  ....................  %%%# | 
| %          % | 
| %          % | 
|           | 
| .          . | 
| .          . | 
| .          . | 
| .          . | 
| .          . | 
| .          . | 
| .          . | 
| .          . | 
| .          . | 
| .          . | 
| .          . | 
|           | 
| %          % | 
| %          % | 
| #%%%  ....................  %%%# | 
--------------------------------------------- 

divが垂直方向に拡張することができます。ブラウザ間で動作する必要があります（CSS3PIEが使用されています）。そしてdivには既に背景画像があります。

移動方法はCSS3 Multiple Backgroundsですか？またはCSS3 Border Imagesが最良の方法ですか？

どの技術を使用すれば、垂直方向に拡張されたdivを処理する上で最も柔軟性がありますか？

Answer 1

構文は次のようなものでなければなりません：の

.flourish{ 
width: 500px; /* just an example */ 
height: auto; 
background-image: url(decoration1.png), url(decoration2.png), url(decoration3.png), url(decoration4.png), url(background.jpg); 
background-repeat: no-repeat; 
background-position: left top, right top, right bottom, left bottom, left top; 
} 

種類の厄介な幅は、その後、あなただけの上部と下部の飾りの背景を持っている可能性が固定されている場合は、これらすべての画像が... をロードすること。

同じ画像を使用してcssを使用して回転することができますが、それを処理するバックグラウンドプロパティは認識していません。