- 综合排序
- 最热优先
- 最新优先
- 来自专栏李蔚蓬的专栏
文档流code案例小汇【处理高度塌陷】
clear mdn文档 clear只是清除浮动，不能缓解【高度塌陷】 https://developer.mozilla.org/zh-CN/docs/Web/CSS/clear 值 none none left right both 解决塌陷 https://codesandbox.io/s/funny-water-4oh3p7?file=/index.html <! DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-<em>8</em>" /> <meta http-equiv="X-UA-Compatible IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>高度塌陷
65030编辑于 2023-01-12 - 来自专栏Coxhuang
CSS Margin塌陷（重叠）
CSS Margin塌陷（重叠） #1 说明 #1.1 什么是Margin塌陷 在标准文档流中，竖直方向（是竖直方向，水平方向的不会出现塌陷现象）的margin会出现叠加现象，即较大的margin会覆盖掉较小的 margin，竖直方向的两个盒子中间只有一个较大的margin，这就是margin的塌陷现象。 注意: 两个盒子的垂直外边距完全接触才会触发 #1.2 塌陷情况有几种? 子盒子和父盒子之间并没出现期望的10px间隙而是父盒子与子盒子一起与页面顶端产生了10px间隙（即父级盒子往下塌陷了10px）。
2.1K30发布于 2020-11-09 - 来自专栏WflynnWeb
css面试点三：清除浮动的九中方法-高度塌陷理解-伪元素使用
浮动框不属于文档流中的普通流，当元素浮动之后，不会影响块级元素的布局，只会影响内联元素布局 当包含框的高度小于浮动框的时候，此时就会出现“高度塌陷”。 为什么要清除浮动？ 高度塌陷 如果父元素只包含浮动元素，且父元素未设置高度和宽度的时候。 那么它的高度就会塌缩为零 解决方法： 1.父级div定义伪类：after和zoom 原理：IE8以上和非IE浏览器才支持:after，原理和方法2有点类似，zoom(IE转有属性)可解决ie6,ie7浮动问题 缺点：只适合高度固定的布局，要给出精确的高度，如果高度和父级div不一样时，会产生问题 建议：不推荐使用，只建议高度固定的布局时使用
<div class height:200px;background:#DDD} .right{float:right;width:30%;height:80px;background:#DDD} </style> 8.1.6K20编辑于 2022-10-28来自专栏前端二次元巧用浮动布局、解决高度塌陷实例分享|技术创作特训营第一期
浮动元素不会影响其他元素的布局，但是它们会创建一个新的块级框，可以设置宽度和高度。浮动元素的特性包括：浮动元素会脱离标准流(脱标)。浮动的元素会一行内显示并且元素顶部对齐。 高度塌陷当然，子元素都浮动以后，会脱离出父div外，导致超出父元素（父元素高度塌陷）。**怎么解决呢？**图片给父div加overflow: hidden清除浮动。 当一个元素包含浮动时，如果不使用 clearfix 方法或其他技术来清除浮动，可能会导致父元素高度塌陷。为了解决这个问题，可以在父元素上设置 overflow: hidden,这样就可以清除浮动了。 【创作提纲】1、浮动的特征和绝妙的应用场景2、overflow: hidden样式的清除浮动，解决高度塌陷3、flex布局4、代码更加优雅！
58511编辑于 2023-08-13</body> </html> 此时运行结果 可以看到子元素并没有离父元素上边距10px而是使整个父盒子塌陷了 10px 这里的解决办法有 给父元素设置border-top 给父元素定义内边距 父元素加overflow:hidden 需要注意的是浮动的盒子不会存在外边距合并塌陷的问题来自专栏生如夏花绚烂外边距合并嵌套块元素塌陷问题
DOCTYPE html> <html> <head> <meta charset="utf-<em>8</em>" /> <meta name="viewport" content
1.1K20编辑于 2022-09-08 - 来自专栏前端Q
理解 margin 塌陷和 margin 合并及其解决方案
今天我们来总结两个不起眼的小问题：margin塌陷和margin合并 margin塌陷 什么是margin塌陷 我们先来看个例子，然后引出什么是margin塌陷 需求：在父子元素中，通过marigin让父元素相对左边及顶部各距离 这种现象被称之为margin塌陷。但很多人可能都不太理解，为什么叫它塌陷？ 其实你可以这样理解，如上述例子，原本子元素要距离父元素顶部50px，现在没有了，也就是父元素的顶棚对子元素来说没有作用，相当于没有，相当于塌陷下来了。所以叫margin塌陷。 但是有的时候我们不希望有这样的问题，那我们如何解决margin塌陷的问题呢？ 答案是，我们可以通过触发BFC来解决！那是什么是BFC呢？ 因为margin合并和margin塌陷不一样，margin塌陷只添加了CSS，margin合并除了添加CSS，还修改了HTML结构。
1.2K40发布于 2021-07-27 - 来自专栏前端面试秘籍
编程篇(010)-如何解决数组塌陷问题
什么叫数组塌陷？ 一个数组在进行删除数据单元操作的时候，删除掉这个单元之后，后面的数据单元会自动的补充的这个位置上来，造成数组长度的减少，这种情况被称之为数组塌陷。 例：循环删除数组中的数据，每循环一次，删除一个数据单元 var arr = [0,1,2,3,4,5,6,7,8,9]; for (var i = 0; i < arr.length; i++) { 如何解决数组塌陷问题呢？
52810编辑于 2022-05-12 - 来自专栏全栈开发那些事
6-8 求二叉树高度 (20分)
本题要求给定二叉树的高度。 BinTree; struct TNode{ ElementType Data; BinTree Left; BinTree Right; }; 要求函数返回给定二叉树BT的高度值
30510编辑于 2023-02-27 - 来自专栏pangguoming
div 自适应高度 自动填充剩余高度
padding: 100px 0 0; box-sizing: border-box ; position: relative; } .A { height: 100px; background: #BBE8F2 padding: 100px 0 0; box-sizing: border-box ; } .A { height: 100px; margin: -100px 0 0; background: #BBE8F2
6.5K40发布于 2018-03-07 - 来自专栏全栈程序员必看
overflow:hidden作用能治住塌陷_html溢出隐藏代码
，高度由随内容增加自适应高度。 当父级元素内部的子元素全部都设置浮动float之后，子元素会脱离标准流，不占位，父级元素检测不到子元素的高度，父级元素高度为0。 ，下面的元素会顶上去，造成页面的塌陷。 因此，需要给父级加个overflow:hidden属性，这样父级的高度就随子级容器及子级内容的高度而自适应。 父级元素内部有子元素，如果给子元素添加margin-top样式，那么父级元素也会跟着下来，造成外边距塌陷，如下： /*css样式*/ <style type="text/css"> .box{
2.7K30编辑于 2022-11-15 - 来自专栏燧机科技-视频AI智能分析
桥梁塌陷边坡落石识别系统
一、引言 我国山区公路桥梁占比超55%，边坡落石、塌陷、泥石流等地质灾害年均发生超1800起（《2024年全国交通基础设施安全蓝皮书》）。 本文提出一种基于YOLOv11目标检测与CNN特征增强的智能识别监测预警系统，通过“多源感知-特征融合-分级联动预警”机制，实现对桥梁塌陷（裂缝＞5cm）、边坡落石（直径＞15cm）、泥石流滑坡（流速＞ backbone，提取灾害目标的纹理（如落石棱角、裂缝走向）、形态特征（如泥石流扇形堆积），输出32维特征向量，通过SVM分类器判断“低风险（裂缝＜3cm）/中风险（落石直径15-30cm）/高风险（桥梁局部塌陷 类目标，按7:2:1划分训练/验证/测试集，引入随机仿射变换（模拟相机视角变化）、MixUp数据增强（提升小目标泛化能力）； 模型轻量化：采用通道剪枝（移除冗余卷积核）+ TensorRT量化（INT8精度 实验室数据（NVIDIA V100 GPU训练，PyTorch 2.2框架）显示，优化后模型在边坡数据集上mAP@0.5达97.8%，单帧检测耗时12ms（83FPS），较YOLOv8基线模型提升40%
34810编辑于 2025-12-31 - 来自专栏全栈程序员必看
关于ViewPager高度自适应（随着pager页的高度改变Viewpager的高度）
viewpager的高度。 解决了冲突问题，但你会遇到这样一个棘手的问题：所有viewpager中的fragment都是那个最大的高度，如果你的fragment中view的高度很小的话，或者view的高度过大的话，会导致自身或者其他 android.widget.LinearLayout; import java.util.HashMap; import java.util.Map; /** * Created by vipui on 16/8/ fragment的高度，（因为预加载到第三个）第一你们第二个fragment的高度是你 第一个fragment的高度（预加载到第一个），以此类推。 java.util.LinkedHashMap; import java.util.List; import java.util.Map; /** * Created by vipui on 16/8/
6.1K30编辑于 2022-09-15 - 来自专栏全栈程序员必看
iframe的高度自适应_div自适应高度
如果iframe始终调用同一个固定高度的页面，我们直接写死iframe高度就可以了。 而如果iframe要切换页面，或者被包含页面要做DOM动态操作，这时候，就需要程序去同步iframe高度和被包含页的实际高度了。 方法二，在主页面iframe的onload事件中执行JS，去取得被包含页的高度内容，然后去同步高度。 如果层展开，则会撑高页面高度。 可以归纳为，当iframe窗体高度高于文档实际高度的时候，高度取的是窗体高度，而当窗体高度低于实际文档高度时，取的是文档实际高度。因此，要想办法在同步高度之前把高度设置到一个比实际文档低的值。
9.3K40编辑于 2022-11-04 - 来自专栏乐行僧的博客
推导B树的最大高度和最小高度得出B树的高度范围
前提条件：n>=1，则对于任意一棵包含n个关键字、高度为h、阶数为m的B树。 一、最小高度： 对于任意树类型的数据结构，如果其每层节点能够分布的足够满，其高度也会随之变得足够的低。 代表向上取整)： //根节点 儿子节点个数[2, m] 关键字个数[1, m-1] //非根节点 儿子节点个数[ceil(m/2), m] 关键字个数[ceil(m/2)-1, m-1] 为了使得B树高度最低 ，也就是每层的节点数达到最大，看如下的计算过程： 二、最大高度： 要使得B树的高度达到最大，也就意味着在每个节点中，关键字的个数达到最小，这样在容纳相同个数的关键字的B树中，其高度可以达到最大。 有了上边我们对最小关键字大小把控，下面来推到B树的最大高度： 总结： 由一和二可知，通过寻找B树的两种极限的存在，推出B树的高度范围为：logm(n+1)<= h <=log(ceil(m/2
5K10编辑于 2022-02-24 - 来自专栏Devops专栏
盒模型使用margin相关技巧及解决margin-top塌陷问题
DOCTYPE html> <html> <head> <title></title> <meta charset="utf-<em>8</em>"> <style type="text/css" 合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。 合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。 margin-top 塌陷 在两个盒子嵌套时候，内部的盒子设置的margin-top会加到外边的盒子上，导致内部的盒子margin-top设置失败，解决方法如下： 1、外部盒子设置一个边框 2、外部盒子设置 这就是传说之中的margin-top塌陷现象。 那么怎么解决呢？
1.9K20发布于 2019-05-31 - 来自专栏全栈程序员必看
页面的高度设置_word页面高度在哪设置
100%}；另外，其他的容器也需要设置height:100%才能达到预期的目的 问题2： ie6下table在table-layout: fixed下，行高不能自动充满 解决：将需要自动充满的行高的高度设置为 100%，即height=100% 问题3：设置doctype后table内部的div高度100%不好使 解决：在这种模式下，需要用具体的高度值进行设置，目前未找到其他方法 发布者：全栈程序员栈长，转载请注明出处
3.6K20编辑于 2022-09-19 - 来自专栏前端资源
根据获取内部元素的高度，设置iframe的高度
iframe 是一个非常迷得一个元素，很难直接获取其内部元素的高度。 下面分享一个方法，可以获取 iframe 内部元素的高度： function setIframeHeight(id){ try{ var iframe = document.getElementById
12.7K20发布于 2019-11-13 - 来自专栏云计算linux
零基础学前端开发技术之第七章 浮动塌陷
知识点： 1.浮动塌陷的概念 2.浮动塌陷的解决 1：浮动塌陷的概念 <! DOCTYPE html> <html> <head> <meta charset="utf-<em>8</em>" /> <title>浮动塌陷的出现</title> <! --第2步：设计CSS样式;div:块状元素；特征：独占1行; float:left;含义；向左看齐； 浮动塌陷：父容器没有设置高度；子容器设置浮动，则子容器会脱离父容器 3.浮动塌陷 1.原因 浮动的子元素，脱离标准文档流。 2.为什么要清除浮动 2.1 父级没高度 2.2 子盒子浮动 2.3影响布局，清除浮动 3.方法： 3.1 额外标签法 设置clear属性，下面为4个值; none： 允许两边都可以有浮动对象 both
36400编辑于 2024-12-19 - 来自专栏从零开始学 Web 前端
textarea内容自动撑开高度，实现高度自适应
但是它有一个缺点是，它的高度是固定了，如果文本内容超出了它设定的高度时，就会显示出丑陋的滚动条。 然后有些时候，为了用户体验，我们需要让它的高度随着文本内容的高度而动态变化。 发微博的输入框会检测输入内容的高度，如果超出的预设的高度，会随着文本的高度的增加而增加，当文本高度减少的时候，文本框的高度也会随着减少。 今天，就来尝试自己实现这个功能。 实现思路 方法一 首先想到的方法就是通过js检测文本的高度，然后动态设置文本框的高度。 这是我的第一想法，也是最容易实现的想法。 具体思路：当出现滚动条的时候，文本的实际高度就是**scrollHeight**，我们只需要设置文本框的高度为内容的**scrollHeight**即可。 代码实现： <! ，那么 textarea 的高度自然就是其中文字内容的高度了。
31.1K50发布于 2021-07-01 - 来自专栏积累沉淀
ie8和chrome获取上传图片的宽度和高度等尺寸
测试后可用 <html> <head> <title>测试</title> <meta charset="utf-<em>8</em>"/> <link rel="stylesheet height=oImg.height; document.body.removeChild(oImg);//放弃预览 }; }; reader.readAsDataURL(oFile); }else{//ie <em>8</em>
2.9K80发布于 2018-03-28
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号