在做IFE2015春季task0001任务的时候，header下方的图片，我试着用background属性来解决，这时候问题来了。
第一次代码
HTML
<body>
<header>
<div id="githublogo">
<a href="http://www.github.com"><img src="img/githublogo.png" alt="www.github.com" height="50" width="50"></a>
</div>
<div>
<ul class="guide">
<li><a href="">首页</a></li>
<li><a href="">文章</a></li>
<li><a href="">作品</a></li>
<li><a href="">关于</a></li>
</ul>
</div>
<div id="logo">
<img src="img/logo.png" alt="Young" height="60" width="110">
</div>
</header>
<div id="pic">
</div>
</body>CSS
#pic {
background: url(/img/back1.jpg);
background-repeat: no-repeat;
}这里面有两个问题。
一个是路径的问题，如果图片存放在css文件夹（存放style.css）中，可以直接饮用url（back1.jpg）；但现在是存放在与css文件夹同目录下的img文件夹内，路径需要加../，即（../img/back1.jpg），路径问题解决
二个是高度设置问题，div是空块，如果直接添加背景，则无法显示，高度为0，所以需要对div设置高度。
修改后的CSS
#pic {
background: url(../img/back1.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
height: 500px;
}问题解决。
扫一扫
197
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
