我想创建一个具有三列背景的网站,其中中心列具有实际内容,侧面用于装饰。
这似乎是一个相对流行的设计(我经常在博客上看到它,但它在很多网站上都有)。大多数Tumblr博客都是很好的例子,它们的内容位于中间,并且两侧都有颜色。在调整窗口大小时,内容的大小不会改变,但是边框会改变。
我想做类似的事情,除了侧面由图像组成,使用CSS。我想要一个有效三列的网站:一个在中间(固定宽度)由一个背景图像组成,用于保存内容(背景图像必须平铺以覆盖整个列,这是可以接受的,图像设计在方式),以及中间内容列两侧的两列(也包括背景中的平铺图像)。两个边列必须可以调整大小,并且图像必须在页面展开时平铺,而不会更改中间内容列的大小。问题是,我没有太多想法如何解决这个问题(有很多关于如何创建三个列布局的指南,但没有一个覆盖三层列背景与平铺图像)。我该如何创建这样的网站?
答案 0 :(得分:1)
答案 1 :(得分:0)
如果两个侧栏使用相同的平铺背景,那么我认为您可以使用background position执行此操作。
在主体上设置平铺背景,其中包含页面顶部中心的原点。
创建固定宽度居中的div作为内容列。在div上设置平铺背景。
当您加宽窗口时,两侧的平铺会增加,但因为您的平铺和div都居中,所以它们将继续顺利排列。
答案 2 :(得分:0)
这个网站不使用HTML5,但它是各种布局的一个很好的初始资源:Layout Gala(好处是HTML保持不变,只是CSS改变。缺点是放在一边从布局框架中,您必须提供自己的CSS。但是,在适当的情况下,使用页眉,页脚和节标记将这些布局转换为使用HTML5很容易。)