如何在div的左侧和右侧有一个可平铺区域？

我有一个div＃main，它具有渐晕效果的背景图像。如何在div的左侧和右侧有一个可平铺区域？

center image background

我想保持这个完整的图像在页面的中心，但我想从最左边的屏幕到该图像的图形砖，和其他图形瓷砖从右侧图像的一侧到屏幕的最右侧。我并不关心拼贴veI意识到我可能会要求设计师让图像的左右边缘具有相同的颜色和纹理，以便我可以在背景中放入相同的纹理颜色，但我试图查看是否我可以解决它。

所以我想我会需要设计师创建两个独立的图形。一个很好地与图像的左边缘进行平铺和融合，另一个平铺并与图像的右边缘很好地融合。

我将如何设置我的div和css，以便左侧瓷砖区域知道从屏幕的最左侧开始，并停止在图像的左侧，并且右侧瓷砖区域知道要开始在图像的右边缘并继续在屏幕的最右侧？

来源

2011-12-12 zeckdude

你能展示一个更好的模拟示例吗？我出于某种原因想像着中间的蓝色，并沿着左侧/右侧平铺背景？那是对的吗？ – Jakub

是的，这是正确的 – zeckdude

像这样的工作，在那里bg_tile.jpg是没有暗角拼贴能够背景，bg.jpg是张贴在你的描述的形象：

#main_wrapper { 
    background: url(/images/bg_tile.jpg) repeat 50% 0; 
} 

#main { 
    width: 960px; 
    height: 300px; 
    margin: 0 auto; 
    background: url(/images/bg.jpg) no-repeat 50% 0 transparent; 
}

有上Cultureamp类似的效果（在iPad后面）。检查CSS以查看它的行动。

来源

2011-12-12 04:55:18

如何在div的左侧和右侧有一个可平铺区域？

回答

相关问题