CSS背景重复X问题
[英]CSS background repeat-x issue
问题描述
i'm beginner in CSS and i try to do somethings but i encountered some problems and here is my problem 
我是CSS的初学者，我尝试做一些事情，但是遇到了一些问题，这是我的问题
i have this peace of CSS code to repeat a background horizontally but i want background to cover just what i wrote not more (there is extra color shown under what i write , i can't upload my photo) 我有这种CSS代码，可以水平地重复背景，但是我希望背景可以覆盖我所写的内容（在我写的内容下显示了额外的颜色，我无法上传照片）
<!DOCTYPE html>
<html>
<head>
<style>
.Container_16 {
margin-left:auto;
margin-right:auto;
width:960px;
}
.Container_5 {
float:left;
}
#Title {
font-size:68px;
font-family:sans-serif;
}
.Container_11{
float:left;
color:white;
}
li{
list-style-type:none;
display:inline;
padding-left:15px;
color:white;
font-size:20px;
font-family:sans-serif;
margin-top:30px;
}
nav{
margin-left:150px;
text-align:right;
margin-top:30px;
margin-right:250px;
}
body{
min-width:960px;
background-image:url("bg.png");
background-repeat:repeat-x;
}
</style>
<body>
<div class="Container_16">
<div class="Container_5" id="Title"><a href="http://www.facebook.com" target="_blank">Book.me</a> </div>
<div class="Container_11"><nav>
<ul>
<li>one</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
</ul>
</nav></div>
</div>
</body>
</head>
</html>
2 个解决方案
解决方案1
0 2014-09-10 10:44:27
To apply background image to facebook link only, use this css: 要将背景图像仅应用于Facebook链接，请使用以下CSS：
#title > a {
background: url('bg.png') repeat-x;
}
解决方案2
0 2014-09-10 11:07:20
Because you are giving the background to body . 因为你是在给body background 。 I see you have <div class="Container_16"> in which you have all your text. 我看到您有<div class="Container_16">中所有的文字。 So you can set the background to that div only. 因此，您只能将背景设置为该div。
CSS 的CSS
body{
min-width:960px;
}
.Container_16 {
margin-left:auto;
margin-right:auto;
width:960px;
height:100px;
background-image:url("image.png");
background-repeat:repeat-x;
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.