我家空空 2021-11-25 10:30 采纳率: 50%
浏览 93
已结题

为什么设置div浮动，不会影响其后面的img元素？

<style>
        .box{
            width: 1260px;
            height: 460px;
        }
        .box img{
            width: 100%;
            height: 100%;
        }
        .box div{
            width: 100px;
            height: 100px;
            background-color: red;
            float: left;
        }
        p{
            height: 360px;
            background-color: blue;
        }
    </style>
<body>
    <div class="box">
        <div></div>
         <img src="./images/03.png" alt="">
        <!-- <p></p> -->
    </div>
</body>

这段代码里，给div设置了浮动，后面的img元素却不会受到影响。但是换成p元素，却会向上移动，产生覆盖的效果？怎么才能使得img元素也产生像p元素一样的效果呢？

img

img

  • 写回答

1条回答 默认 最新

  • 你好！机器人 2021-11-25 10:37
    关注
    
<style>
        .box{
            width: 1260px;
            height: 460px;
            position:relative;
        }
        .box img{
            width: 100%;
            height: 100%;

        }
        .box div{
            width: 100px;
            height: 100px;
            background-color: red;
            position:absolute;
            top:0;
            left:0;
        }
        p{
            height: 360px;
            background-color: blue;
        }
    </style>
<body>
    <div class="box">
        <div></div>
        <img src="aa/dygj-m/images/index_01.jpg" alt="">

    </div>
</body>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题？

问题事件

  • 系统已结题 12月3日
  • 已采纳回答 11月25日
  • 创建了问题 11月25日

悬赏问题

  • ¥15 求指导ADS低噪放设计
  • ¥15 CARSIM前车变道设置
  • ¥50 三种调度算法报错 有实例
  • ¥15 关于#python#的问题，请各位专家解答！
  • ¥200 询问：python实现大地主题正反算的程序设计，有偿
  • ¥15 smptlib使用465端口发送邮件失败
  • ¥200 总是报错，能帮助用python实现程序实现高斯正反算吗？有偿
  • ¥15 对于squad数据集的基于bert模型的微调
  • ¥15 为什么我运行这个网络会出现以下报错？CRNN神经网络
  • ¥20 steam下载游戏占用内存