问题
#data-wrapper {
background:url("../images/repeat-bg.png") repeat-y 0 46px transparent;}
I want to start repeat-bg.png as a repeat-y but after 46px area from top of #data-wrapper. Is it possible to do like this?
回答1:
You need to apply the background image to a containing div with 46px margin.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<style type="text/css">
#container {
background:url("../images/repeat-bg.png") repeat-y; margin-top:46px; height:600px;}
/* height:600px is only critical to the demo code and can be removed once the page has content */
</style>
</head>
<body>
<div id="container">
<!--All of your content goes here-->
</div>
</body>
</html>
In addition to this method, if support for this is not critical, you could be forward thinking and adopt the currently very under-supported CSS3 multiple-background declaration.
body {background:url("bg1.png") top no-repeat, url("bg2.png") bottom repeat-y;}
回答2:
You mean so that the top 46 Pixels have no background image?
No, that's not possible, sorry. You'll have to work around it, e.g. using another div with a margin.
来源：https://stackoverflow.com/questions/3970064/how-to-start-background-repeat-y-after-46px-space