重叠后位置为什么会有偏移呢

来源:2-5 position-relative

能量咕噜略略

2020-01-09 20:55:29

<!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>

      .block{

         position:relative;

         top:0;

         left:0;

         width:200px;

         height:200px;

         line-height:200px;

         border:2px red solid;

         text-align: center; 

         float:left;

         

      }

      .block:nth-child(2){ 

         top:0;

         left:-200px;

         border-color:blue;

      }

   </style>

</head>

<body>

   <div class="block">A</div>

   <div class="block">B</div>

</body>

</html>


写回答

1回答

好帮手慕粉

2020-01-10

同学你好,因为同学在给第二个div设置偏移值时,忽略了边框的宽度,因为左右各有2px的边框,所以第一个div的实际宽度为204px。参考:

http://img.mukewang.com/climg/5e17e06a0918b2c904240201.jpg

如果我的回答帮助到了你,欢迎采纳,祝学习愉快~

0

0 学习 · 40143 问题

查看课程