CSS 指定溢出方向 应该如何设置?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了CSS 指定溢出方向 应该如何设置?相关的知识,希望对你有一定的参考价值。

如何设置DIV的溢出方向呢?
比如让DIV的溢出,不总是往下往右,也设置向左上,并不影响其他DIV。
如写出正确例子,加分20:)

举例:
上面一个DIV,下面一个DIV。
下面的DIV溢出后(内容超出本身DIV大小),溢出部分出现在上面的DIV范围内。

参考技术A <div style="width:300px; height:200px; border:1px solid red; position:relative; padding:3px;">
<div style="width:300px; height:100px; border:1px solid green;">文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字</div>
<div style="position:absolute; bottom:0px; height:100px; overflow:visible; width:300px;border:1px solid blue;">21321312 1287312 123 213 7912 3123192731237217 3123 721 3123 7219837 21321312 1287312 123 213 7912 3123192731237217 3123 721 3123 7219837 21321312 1287312 123 213 7912 3123192731237217 3123 721 3123 7219837</div>
</div>

下面蓝色边界的DIV里的数字覆盖了绿色边界的DIV,是向上溢出的
参考技术B 那样的话,只能是在你的下面那个DIV里再套一个元素,
并设置该元素float:right;margin-right:0px;margin-bottom:0px;

以上是关于CSS 指定溢出方向 应该如何设置?的主要内容,如果未能解决你的问题,请参考以下文章

CSS3内容溢出详解

CSS3如何实现超出指定文本以省略号显示效果

css3重要语法汇总

css3重要语法汇总

Electron 中的 CSS:只允许在特定方向上溢出

css多列布局 multi-column(瀑布流布局)