三个div上中下布局如何让两个div上下排列( 四 )

overflow溢出scroll：必定出现滚动条auto：子元素内容大于父元素时出现滚动条visible：溢出的内容出现在父元素之外hidden：溢出时隐藏如何实现：单行文本溢出加 …(*)white-space: nowrap; /* 首先，强制文本不换行；*/ overflow: hidden; /*其次，隐藏溢出；*/text-overflow: ellipsis; /*最后，对溢出的文本用 ellipsis 省略号代替。*/全屏滚动的原理？需要哪些css属性？原理类似于轮播图，整体元素一直排列下去，假设有5个需要展示的全屏页面，那么高度将会是500% ，但我们只能展示100% ，剩下的内容可以通过transform进行Y轴定位，也可以通过margin-top实现
涉及css属性overflow:hidden | transition:all 1000ms ease
BFC块级格式上下文什么是BFC？BFC直译为块级格式化上下文，它是一个独立的渲染区域，只有Block-level box参与，它规定了内部的Block-level Box如何布局，并且与外部毫不相干。W3C对BFC的定义如下：浮动元素和绝对定位元素，非块级盒子的块级容器（例如，内联块，表单元格和表标题），以及溢出值不为“可见”的块级盒子，，都会为他们的内容创建新的BFC（阻止Fromatting上下文，即块级格式文本）。注意：可以把BFC理解为一个大的盒子，其内部是由Block-level box组成的如何触发BFC？（*）根元素 → 根元素（html）就是最大的BFCposition设置为 fixed 或者 absolutedisplay设置为 inline-block 、table-block 、table-captionoverflow的值不为visiblefloat的值不为noneBFC布局规则：内部的Box会在垂直方向，一个接一个地放置。Box垂直方向的距离由margin决定。属于同一个BFC的两个相邻Box的margin会发生重叠每个元素的margin box的左边，与包含块的左边相接触(对于从左往右的格式化，否则相反) 。即使存在浮动也是如此。BFC的区域不会与外部float box重叠。BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素。反之也如此。计算BFC的高度时，浮动元素也参与计算BFC的作用及原理：自适应两栏布局清除内部浮动防止垂直 margin 重叠（将垂直方向上的盒子放在不同的 BFC 中， margin 就不会重叠了。）BFC内部的元素和外部的元素绝对不会互相影响，因此，当BFC外部存在浮动时，它不应该影响BFC内部Box的布局， BFC会通过变窄，而不与浮动有重叠。同样的，当BFC内部有浮动时，为了不影响外部元素的布局， BFC计算高度时会包括浮动的高度。避免margin重叠也是这样的一个道理。IFC行内格式上下文内部的盒子一个接着一个地排列，起点是包含块的顶点。如果一行放不下内容，那么会被“拆”开放到下一行。只有水平方向上的 Margin 会在盒子中保留。Padding 和 Border 不会撑开行高。z-index层叠上下文z-index 可以解决元素之间覆盖顺序的问题，设置它的层叠顺序。如果元素是没有定位的，对其设置的 z-index 会是无效的。元素层叠时，覆盖关系准则（*）同父同级元素当具有明显的层叠水平标示时，如识别的z-index值z-index大的覆盖小的，数值越大，越靠近视觉点。z-index相同时，在DOM流中处于后面会覆盖前面。都没有设置 z-index时，使用默认值，一个定位一个没有定位，那么定位覆盖未定位元素。都没有定位且发生位置重合现象时，在DOM流中处于后面会覆盖前面。父子层级元素不同父元素，只要父元素越大，那么整体就越靠近视觉点，而不管其子元素大小情况。如果父元素 z-index 有效，那么子元素无论是否设置 z-index 都和父元素一致，会在父元素上方；如果父元素 z-index 失效（未定位或者使用默认值），那么定位子元素的 z-index 设置生效。层叠上下文的创建根层叠上下文指的是页面根元素，也就是滚动条的默认的始作俑者元素。这就是为什么，绝对定位元素在left/top等值定位的时候，如果没有其他定位元素限制，会相对浏览器窗口定位的原因。

以上关于本文的内容，仅作参考！温馨提示：如遇健康、疾病相关的问题，请您及时就医或请专业人士给予相关指导!

「四川龙网」www.sichuanlong.com小编还为您精选了以下内容，希望对您有所帮助：

三个div上中下布局 如何让两个div上下排列( 四 )

三个div上中下布局如何让两个div上下排列( 四 )