html - css 垂直重复背景

Question

我似乎无法弄清楚如何在 <div> 上垂直重复背景图像这是我的代码。

http://jsfiddle.net/pedenski/Sw6wB/

我在这里试图完成的是在页面的一侧放置阴影效果。类似于 http://www.adobe.com/网站。您会在两侧看到阴影边框。

Answer 1

您的左右 div 没有高度。

参见 this更新了 JS fiddle 。

我添加了 height:100px; 只是为了证明它有效

div#right {
    background-image:url(http://i45.tinypic.com/ejv8uq.png);
    background-repeat: repeat-y;
    width:100px;
    height:100px;
    float:right;
}

这里是左 block 的修复(background-position:top right; 和高度):

div#left {
    background-image:url(http://i47.tinypic.com/2hsc187.png);
    width:100px;
    height:100px;
    float:left;
    background-repeat: repeat-y;
    background-position:top right;
}