4-3编程问题
来源:4-3 编程练习
qq_暮色兮凉城_2
2018-05-15 18:41:34
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>4-3编程联系</title>
<style>
*{
margin:0;
padding:0;
}
.page{
width:100%;
height:4033px;
background:url(http://climg.mukewang.com/59c9f7ce0001839219034033.png) center top no-repeat;
position:relative;
}
.foot:nth-child(1){
width:200px;
height:260px;
position:fixed;
left:0px;
top:50%;
margin-top:-130px;
background:url(http://climg.mukewang.com/5a3383d00001a3dd02240364.png);
}
.foot:nth-child(2){
width:200px;
height:260px;
position:fixed;
right:0px;
top:50%;
margin-top:-130px;
background:url(http://climg.mukewang.com/5a3383c70001f1b702240364.png);
}
</style>
</head>
<body>
<div class="page">
<div class="foot">
</div>
<div cilass="foot">
</div>
</div>
</body>
</html> 图片宽度设置为100%,图片没有显示全,还有部分内容被遮盖,
当网页缩减至70%的时候才能看见全部,高度设置为100%的时候图
片不显示这个是为什么? 还有,右边图片怎么没有显示出来?
1回答
1、图片宽度设置为100%之后,本身像素是1903x4033像素的,如果显示器分辨率不够大的情况下,会显示一部分。
2、设置背景图片,高度必须是固定的像素才能显示出来,百分比是不可以的。
3、第二个图片的class写错了,如下:

自己修改下,祝学习愉快~~