向 div 角和边框添加华丽的技术：CSS3 多个背景或边框图像？

Question

我正在“装饰”一个现有网站，在内容 div 的角落和边框上添加一些漂亮的装饰。完全不更改标记（因为它是由 CMS 生成的），我如何添加“蓬勃发展”图像（即 像这样的角落繁荣）和仅使用 CSS 的精美边框？

花哨的 ASCII 艺术表示我想要实现的目标（外边框代表 div）：

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

div 可以垂直扩展。它需要跨浏览器工作（正在使用CSS3PIE）。而且 div 已经有背景图片了。

CSS3 多重背景 是正确的选择吗？或者 CSS3 边框图像 是最好的方法吗？

哪种技术在处理垂直扩展的 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 旋转它，那就更好了，但我不知道有任何背景属性可以处理这个问题。