Question

根据浏览器的不同，我有一个流畅的div。我想在div的左侧和右侧都有一个边框图像。我该怎么办？我根据需要左侧工作：

#conten {

 background: #fff url(/images/pagebgleft.gif) top left repeat-y;
 color: #333333;
 float: none;
 width: 80%;
 max-width: 1080px;
 margin: auto ;
 }

我想在右侧使用图片url(/images/pagebgright.gif)。谢谢！

Answer 1

使用多个背景或放置另一个包装div并设置右手背景。

Answer 2

我可能发布太晚了。每个边框都需要在它自己的div中，并且绝对位于相对位置容器内。我正在使用的背景图像恰好是我从谷歌获得的动画边框gif。

<div class="wrap">
    <div class="leftb"></div>   
    <div class="rightb"></div>   
</div>

.wrap{
    position:absolute;
    width:400px;
    height:400px;
    background:#ccc;
}
.leftb, .rightb{
    position:absolute;
    top:0;
    background: transparent url(http://www.capriogroup.com/webstuff/Images/Borders/Animated-Border-ChainLinksVertical.gif) repeat-y 0 0;
    color: #333333;
    width: 20px;
    height:400px;
}

.leftb {
    left:0;    
}

.rightb {
    right:0;
}

检查http://jsfiddle.net/ZxQ6Z/1/

处的工作示例

如何在容器div的左侧和右侧重复边框.gif？

2 个答案:

检查http://jsfiddle.net/ZxQ6Z/1/