我是新来的CSS,我不知道我应该如何添加一个背景图像只为我的头。我已经有了整个页面的背景图片,但是我知道我只需要为我的页眉设置一个背景图片。为什么这段代码不起作用,我应该如何解决它。设置第二个背景图片?
HTML代码:
<!DOCTYPE html>
<html lang="nl">
<head>
<title>De fonduepot | Home</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="css/start.css" />
<link rel="stylesheet" href="css/styles.css" />
<link rel="stylesheet" href="css/home.css" />
<link href='http://fonts.googleapis.com/css?family=Bitter' rel='stylesheet' type='text/css'>
</head>
<body>
<header>
<div class="wrapper">
<img class="left" src="images/thefonduepot.png" alt="foto van een fonduepot" />
<h1>De fonduepot</h1>
<img class="right" src="images/thefonduepot.png" alt="foto van een fonduepot" />
</div>
</header>
</body>
</html>
CSS代码:
body {
background-image: url("../images/houtachtergrond.jpg");
}
.wrapper {
width: 70%;
margin: 0 auto;
}
header .wrapper {
background-image: url("../images/zand.jpg");
}
h1 {
float: left;
font-family: 'Bitter', serif;
font-size: 4rem;
line-height: 3.5rem;
width: 20rem;
text-align: center;
margin-left: 9rem;
color: #8A0810;
margin-top: 1.25rem;
}
header .left {
float: left;
width: 10rem;
}
header .right {
float: right;
width: 10rem;
}
感谢它的工作 – user3275947