html - 定制使用 CSS 的边框

Question

我正在尝试创建一个类似于此站点的网页：

我尝试使用该设计创建图像（中间的图像具有白色背景和顶部和底部的尖边），但结果是图像是静态的，并且在页面内容更改时不会动态更改。

我不知道我是否可以通过自定义<div>边框来实现设计或将设计上传为背景图像然后动态创建它。

感谢所有的帮助。

Answer 1

如果您不想使用 CSS3（以获得更多浏览器支持），请使用以下结构：

<div class="conatiner">
    <div class="pointyHeader"></div>
    <div class="content">
         your dynamic content here
    </div>
    <div class="pointyFooter"></div>
</div>

在哪里pointyHeader并且pointyFooter有一个固定的高度和背景图像。

工作的jsFiddle

Answer 2

我想到了一个.box { position: relative; } 和一个.top { position: absolute; top: 0; }和底部相同的.bottom { position: absolute; bottom: 0;}

在这里检查：http: //jsfiddle.net/DyG8F/