我们之前讲过如果只有子元素设置了margin top而父元素没有边框则会跟着被顶下来的。

而我们怎么解决这个问题呢？

就是给父元素设置一个边框

而为什么我们在第二个浮动的盒子设置边框没有用呢？应为第一个盒子浮动了以后，第二个盒子前面就没有元素了，就默认是body父元素了，所以我们如果不给父元素设置边框就会被顶下来。

而我们给body设置边框仅仅是为了演示一下这个现象，因为在企业开发中我们没有人会给body设置边框的。

给body添加一个边框以后，再给div2添加边框发现设置10px没有效果

然后我们又给它设置18px，发现还是没有效果

为什么没有效果呢?

因为div2会把div1给覆盖了，所以设置了22px也看不到

我们怎么知道文字有多高呢？

发现文字的默认高度是100*22，所以文字的高度是22

所以我们只要设置了大于22就可以看出来了

课时133.margintop失效原因（理解）的更多相关文章

  1. 清除浮动元素的margin-top失效原因（更改之前的错误）

    //样式代码body,div{ margin:; padding:; } .box1{ background:#900; width:200px; height:200px; margin:20px ...

  2. div里面的margin-top失效

    div标签中的元素margin-top失效的解决方法 元素上级标签是div,已经设置了width和height等的属性,可是,在对元素使用margin进行调整的时候,无法生效,下面有个不错的解决方法, ...

  3. 高阶篇：4.2.2）DFMEA层级分明的失效模式、失效后果、失效原因

    本章目的:明确失效模式.失效后果.失效原因的定义,分清楚层次关系,完成DFMEA这部分的填写. 1.失效模式,失效后果,失效原因的定义: 这是FEMEA手册第四册中的定义. 1.1 潜在失效模式 (b ...

  4. margin-top失效的解决方法

    异常处理汇总-前端系列 http://www.cnblogs.com/dunitian/p/4523015.html 我的是属于这种情况 按照网上的说法,我就是这个现象了 两个层box1和box2,b ...

  5. oracle 索引失效原因及解决方法

    oracle 索引失效原因及解决方法 2010年11月26日 星期五 17:10 一.以下的方法会引起索引失效 ‍1,<>2,单独的>,<,(有时会用到,有时不会)3,like ...

  6. 关于margin-top失效的解决方法

    常出现两种情况:(一)margin-top失效 先看下面代码: <div><div class="box1" >float:left</div> ...

  7. div中嵌套div中使用margin-top失效问题

    div中嵌套div中使用margin-top失效问题

  8. kubectl get 后按2次tab键命令补全的失效原因分析

    kubectl get 后按2次tab键命令补全的失效原因分析 2019/10/28 Chenxin a.bash客户端工具 在centos用户下, cd ~;echo "source &l ...

  9. Synchronized 失效原因

    Synchronized 同步出现失效 Synchronized ,大家都知道这个是Java 提供的一种原子性内置锁,其实现原理是通过获取对象的监视器monitor进行来实现同步的,只有当线程获取到对 ...

随机推荐

  1. coder/programmer engineer Chirf Technology Offcer

    大概是某个C轮融资的医疗网站CTO被离职.而CTO是一个知乎大V和微信大号.此事一出,在微信群有支持也有反对之声.支持此CTO被离职的认为其在工作时没有Review程序,自己不写代码,而是热衷出没于技 ...

  2. wcf 配置与代码创建

    <behaviors> <serviceBehaviors> <behavior name="MyServiceBehavior"> <s ...

  3. PPTP has become obsolete

    https://www.ovpn.com/en/blog/pptp-has-become-obsolete/ PPTP has become obsolete What is PPTP? PPTP s ...

  4. 一个老IT产品管理者对于产品经理工作的经验总结

    一个老IT产品管理者对于产品经理工作的经验总结 1. 任何行业,包括IT行业,所谓产品管理.产品经理,其核心应该是企业产品管理制度,也就是说,只有企业存在相应的.合理的产品管理体系和制度,产品管理.产 ...

  5. 使用SAP C4C rule editor动态控制UI上某个按钮是否显示

    假设我想根据Sales Order的outbound delivery字段来控制这个Trigger Delivery按钮的动态显示: 首先Adapt->Edit Master Layout进入K ...

  6. 可变长度参数以及foreach循环原理

    语法糖 接下来几篇文章要开启一个Java语法糖系列,所以首先讲讲什么是语法糖.语法糖是一种几乎每种语言或多或少都提供过的一些方便程序员开发代码的语法,它只是编译器实现的一些小把戏罢了,编译期间以特定的 ...

  7. non-fragile：oc2.0特性

    Runtime Versions and Platforms There are different versions of the Objective-C runtime on different ...

  8. 完整详解GCD系列（三）dispatch_group

    http://blog.csdn.net/hello_hwc/article/details/41409135 一.dispatch_group把一组任务提交到队列中,这些队列可以不相关,然后坚挺这组 ...

  9. 【深入理解JVM】：Java内存模型JMM

    多任务和高并发的内存交互 多任务和高并发是衡量一台计算机处理器的能力重要指标之一.一般衡量一个服务器性能的高低好坏,使用每秒事务处理数(Transactions Per Second,TPS)这个指标 ...

  10. cv2.resize

    import cv2 img = cv2.imread('0_116_99_355_0.jpg') # 方法一: # res = cv2.resize(img,None,fx=2,fy=2,inter ...