为什么打开同一个网页显示效果不一样
来源：2-13 编程练习
球球不一般
2021-07-12 19:50:41
代码如下<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>background-clip</title>
<style type="text/css">
.border,
.padding,
.content {
/*给最外层的div设置样式*/
width: 300px;
height: 300px;
float: left;
margin-left: 50px;
}
a {
text-decoration: none;
font-size: 30px;
}
.div1,
.div2,
.div3 {
/*放置背景图片的div样式*/
width: 220px;
height: 200px;
border: 10px solid rgba(0, 255, 0, 0.3);
padding: 50px;
background-image: url("http://climg.mukewang.com/582c316e0001fd6507000210.jpg");
margin-top: 50px;
}
.border:hover div,oioo
.padding:hover div,
.content:hover div {
display: block;
}
.border:hover .div1{
background-clip:border-box;
} .padding:hover .div2{
background-clip:padding-box;
} .content:hover .div3{
background-clip:content-box;
}
</style>
</head>
<body>
<div class="border">
<a href="">border-box</a>
<div class="div1"></div>
</div>
<div class="padding">
<a href="">padding-box</a>
<div class="div2"></div>
</div>
<div class="content">
<a href="">content-box</a>
<div class="div3"></div>
</div>
</body>
</html>用Visual Studio Code打开网页是这样的
在文件夹打开网页是这样的
1回答
-
好帮手慕久久
2021-07-13
同学你好，老师测试同学的代码，两种方式打开效果是一样的。正常情况下，效果就应该是一样的。建议同学检查一下两个页面是否有放大：
如果有的话，建议点击放大镜，将页面缩放比还原成100%。
如果不是这个问题，建议同学将页面截图截得大些，尽量将浏览器地址栏全部截上，老师再看下。
祝学习愉快！
0
相似问题
回答 1