12345678910111213
<html> <head> <title>背景颜色实例</title> </head> <body> <style type="text/css"> .bg{ width: 100pxheight: 100pxbackground-color: red} </style> <div class="bg"></div> </body></html>
设置了一个长宽均为100px,背景为红色的div
你可以弄一张大的背景,中间是空放在body那边,然后一切布局就按照正常情况弄,上面还是弄一个DIV,让在这个div里面填充背景了。至于左右有背景可以不管他。我是这么理解你的问题,也是这么处理,你可以参考下。1、控制背景重复:如果需要在页面上对背景图像进行平铺,可以使用 background-repeat 属性。
属性值 repeat 导致图像在水平垂直方向上都平铺,就像以往背景图像的通常做法一样。repeat-x 和 repeat-y 分别导致图像只在水平或垂直方向上重复,no-repeat 则不允许图像在任何方向上平铺。
默认地,背景图像将从一个元素的左上角开始举例如下:
body
{
background-image: url(/i/eg_bg_03.gif)
background-repeat: repeat-y
}
2、控制背景位置
可以利用 background-position 属性改变图像在背景中的位置。
下面的例子在 body 元素中将一个背景图像居中放置:
body
{
background-image:url('/i/eg_bg_03.gif')
background-repeat:no-repeat
background-position:center
}
首先,可以使用一些关键字:top、bottom、left、right 和 center。通常,这些关键字会成对出现,不过也不总是这样。还可以使用长度值,如 100px 或 5cm,最后也可以使用百分数值。不同类型的值对于背景图像的放置稍有差异。