無論我做什麼,在使用CSS進行格式設置時,我都無法在.container div中顯示圖像。只顯示圖像的最高〜10%。如果我把這個img標籤放在HTML裏面,它會很好地工作。但是我想用CSS來格式化,而不是HTML,並且這樣做是爲了與移動優先兼容。我想要的是讓圖像居中並且大於當前顯示的圖像。這是我的HTML:CSS - 背景圖片顯示不正確
<!DOCTYPE html>
<html lang="en-US">
<link rel="stylesheet" type="text/css" href="RABstyle.css">
<title>Home</title>
<meta charset = "UTF-8">
<meta name="author" content="Beth Bennett">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<body>
<header>
<div class="icons"><p>Icons</p></div>
<ul class = "buttons">
<button id="LogIn" type="button">Log In</button>
<button id="SignUp" type="button">Sign Up</button>
</ul>
</header>
<div class="container">
<h2 class="intro">America's source for....</h2>
<ul class="selector">
<li class="active"><a href="#">Ds</a></li>
<li><a href="#">Cs</a></li>
<li><a href="#">Or</a></li>
</ul>
</div>
</body>
</html>
這裏是我的CSS:
* {
box-sizing: border-box;
margin: 0px;
padding:0px;
font-family: Calibri, Helvetica, sans-serif;
}
body {
background-color:#ffffE0;
}
header {
background-color: #AA0000;
height: 75px;
padding: 15px;
}
.icons{
float: left;
margin-left: 100px;
}
.buttons {
text-align: right;
margin-right: 300px;
}
.container {
background: url("HomePageImageFinal.svg") no-repeat;
background-position: center top;
background-size: 1500px 1000px;
}
給我們一個到您的HTML文件的活動鏈接,其中顯示您的背景圖片? –