w1s2x35 2021-05-07 13:41 采纳率: 100%
浏览 199
已采纳

css中为什么margin-right不管用?

<!DOCTYPE html>

<html lang="ch">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <style>

     *{

         margin: 0;

         padding: 0;

     }

       .kuai{

             width: 200px;

             height: 200px;

             border: red solid 1px;

              

             position: absolute;

             right: 0;

             left: 0;

             top:0;

             bottom:0;

             margin: auto;

            

       }

     

          .cirle2{   

         width: 200px;

         height: 200px;

         border: red solid 1px;

         border-radius: 50%; 

           position: absolute;   

           top:50%;

             left: 50%;

             transform:translate(-50%,-50%);

              margin-right: 50%; 

     }  

      

    </style>

 

</head>

<body>

   <div class="kuai">

           <div class="cirle2"></div>

   </div>

</body>

</html>

展开全部

  • 写回答

5条回答 默认 最新

  • 梁什么鸭, 2021-05-07 17:23
    关注

    首先指出你的问题:

    一般都是子级元素用绝对定位,父级元素用相对定位。但你kuai 和 circle都用绝对定位?所以你是想以body为相对定位??

    再然后你说margin-right没有起作用,其实起作用了,你打开控制台查看元素,就会看到这个属性并没有被划掉,说明执行了。

    为什么没有明显效果,是因为在kuai中你设置了它的margin:auto;且left/right/top/bottom都为0 ,也就是说在kuai的border外都是kuai的margin,circle移动不了,所以你想改变circle的位置要改变绝对定位中的right

     

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(4条)
编辑
预览

报告相同问题?

悬赏问题

  • ¥15 R语言shiny包和ncdf4包报错
  • ¥15 origin绘制有显著差异的柱状图和聚类热图
  • ¥20 simulink实现滑模控制和pid控制对比,提现前者优势
  • ¥30 开发一款闲置物资借用管理软件
  • ¥15 (有偿)1500/怎么让网络延迟网速不变/需要做成软件/
  • ¥15 空调变频器板怎么测试可靠性和性能
  • ¥15 uniapp开发:微信小程序使用drawImage绘制第二次时不生效?
  • ¥500 tdx winner 函数计算公式,需和官方一样,1000元
  • ¥15 word 样式管理树状设计
  • ¥15 中国json地图的点击事件
手机看
程序员都在用的中文IT技术交流社区

程序员都在用的中文IT技术交流社区

专业的中文 IT 技术社区,与千万技术人共成长

专业的中文 IT 技术社区,与千万技术人共成长

关注【CSDN】视频号,行业资讯、技术分享精彩不断,直播好礼送不停!

关注【CSDN】视频号,行业资讯、技术分享精彩不断,直播好礼送不停!

客服 返回
顶部