我正在尝试制作一个菜单，它运行良好，但是，当我缩小窗口并滚动时，背景不会扩展。示例:
第一张图片是全屏的，第二张图片是我滚动页面后的。如您所见，背景没有延伸。下面是我的 CSS:
body{
padding: 0px;
margin: 0px;
font-family:Arial, Helvetica, sans-serif;
background-color: #717070;
}
.header{
background-image: url("img/bgsmall.png");
height: 100px;
background-repeat: repeat-x;
min-width: 1000px;
}
.logo{
margin-left:320px;
float:left;
}
#menu{
position: relative;
height: 100px;
text-align: center;
width:auto;
margin-left:600px;
min-width:1000px;
}
#menu ul{
list-style: none;
padding: 0;
margin: 0;
position:relative;
}
#menu li{
float: left;
display: inline;
padding-top:35px;
position:relative;
text-transform:uppercase;
}
#menu li a{
text-decoration: none;
padding-left: 32px;
padding-right: 32px;
font-size: 15px;
font-family: arial;
color: #ffffff;
text-align:center;
}
#menu li a:visited{
color: #ffffff;
}
#menu li a:hover{
color: #D86C00;
}
HTML代码
<html>
<head>
<link href="stylesheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="header">
<div id="menu">
<ul>
<li><a href="#">page1</a></li>
<li><a href="#">page2</a></li>
<li><a href="#">page3</a></li>
<li><a href="#">page4</a></li>
</ul>
</div></div>
</body>
</html>
提前致谢。
最佳答案
将 position:absolute; 添加到您的 .header 类。
关于滚动后 HTML 背景重复被切断，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12110066/