求解 我实现的这个效果与效果图不一致但缩放浏览器后 可以保持与效果图一致请问我这个实现办法是对的吗?
来源:4-3 编程练习
纵有疾风起呵
2019-03-31 17:47:10
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
*{margin: 0;padding: 0;}
.zhujiemian{width: 100%;height: 4033px;
background: url("../img/zhujiemian.jpg") no-repeat center top;}
.web{width: 224px;height: 364px;
background: url("../img/webzuoyetu.jpg") no-repeat;
left: 0;top: 50%;position: fixed;
margin-top: -182px;}
.java{width: 224px;height: 364px;
background: url("../img/javazuoyetu.jpg") no-repeat;
right: 0;top: 50%;margin-top: -182px;position: fixed;
}
</style>
</head>
<body>
<div class="zhujiemian">
<div class="web"></div>
<div class="java"></div>
</div>
</body>
</html>
1回答
好帮手慕夭夭
2019-04-01
你好同学, 因为代码中使用的图片是同学自己本地的,老师把图片替换成本题提供的图片测试 ,效果实现的正确哦。因为不同刘浏览器分辨率不一样 ,所以展现的效果自然是有一些差别很正常,只要页面样式不乱 ,两边的图片固定在浏览器两侧并且垂直居中就行。
另外 ,建议同学在练习时 ,如果题中提供了素材 ,建议使用素材 ,这样老师能够更准确的帮助到你检查问题哦

祝学习愉快 ,望采纳。
相似问题