我body和.opacity宽高都设成了100%，照理说都是视窗的宽高

可用f12查看div范围的时候，opacity和body虽然都是一样的width和height，但范围明显不一样，

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Document</title>

<style type="text/css">

*{padding:0;

margin:0;}

html,body{

width:100%;

height: 100%;

}

.con{

width:100%;

height:4000px;

background:url(mooc.png) center top no-repeat;

}

.opacity{

width:100%;

height:100%;

opacity:0.5;

background:black;

position:fixed;

top:0;

}

.login{

width:360px;

height:360px;

background:url(login.png);

position:fixed;

top:50%;

left:50%;

margin-left:-180px;

margin-top:-180px;

z-index:1;

}

</style>

</head>

<body>

<div class="con">

</div>

<div class="login">

</div>

<div class="opacity">

</div>

</body>

</html>

weibo_飞来云去_0 2017-07-23

源自：CSS定位（position） 4-1 定位和边距的区别以及弹出层的简单实例

收起

2回答

好帮手慕糖 2017-07-23 15:45:07

你好，正常显示的宽高都是一样的，至于颜色加深的范围，可是是由于其他元素的浮动影响的。祝学习愉快！

收起回答

好帮手慕糖 2017-07-23 11:47:24

你好，我这里查看都是一样的呀，如下两个图；祝学习愉快！

收起回答

提问者 weibo_飞来云去_0 #1

对，div的尺寸都是一样的，我的开发者工具是在右边，但是鼠标点到div时网页上一般对应着div范围内颜色加深显示，两个div的height显示范围明显不一样

2017-07-23 13:07:54
ddcatzlx 回复提问者 weibo_飞来云去_0 #2

确实是哎，我这边body那块儿也是显示固定宽高，不过是1295x729,不懂为什么会这样，而且老师怎么后面怎么没有回复你这个问题啊？

2017-08-13 15:26:21
提问者 weibo_飞来云去_0 回复 ddcatzlx #3

因为无关紧要，还没细究到那个级别，另外助教的能力范围都不一样且有限。你的宽高和我的不一样应该是浏览器窗口不一样所致，这个没什么大不了的

2017-08-13 18:57:09