浮动元素不能覆盖的元素

最新推荐文章于 2023-03-15 17:27:52 发布

绘梦逐心

最新推荐文章于 2023-03-15 17:27:52 发布

阅读量765

点赞数 2

分类专栏：前端文章标签： html css

本文链接：https://blog.csdn.net/qq_37873484/article/details/106817992

版权

前端专栏收录该内容

13 篇文章 0 订阅

订阅专栏

 浮动的元素可以覆盖标准流中的块级元素

那么
浮动元素不能覆盖哪些元素呢？
- 浮动的元素不能覆盖行内块元素
- 浮动元素不能覆盖行内元素
- 浮动的元素不能覆盖文字（图文环绕 最初的目的）

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    .father {
      width: 400px;
      height: 400px;
      background-color: green;
    }

    .red {
      width: 100px;
      height: 100px;
      background-color: red;

      float: left;
    }

    .blue {
      width: 110px;
      height: 110px;
      background-color: blue;

      /* display: inline-block; */
      /* display: inline; */
    }

  </style>
</head>
<body>
  <div class="father">
    <div class="red"></div>
    <div class="blue">我是文字</div>
  </div>
</body>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

绘梦逐心

关注关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
浮动元素不能覆盖的元素

浮动的元素可以覆盖标准流中的块级元素那么浮动元素不能覆盖哪些元素呢？- 浮动的元素不能覆盖行内块元素- 浮动元素不能覆盖行内元素- 浮动的元素不能覆盖文字（图文环绕最初的目的）<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale.
复制链接

扫一扫