position:absolute用法(隐藏溢出部分)

html-css021

position:absolute用法(隐藏溢出部分),第1张

地址: https://www.cnblogs.com/goloving/p/9275776.html

1、绝对定位元素溢出父元素,怎么隐藏问题?

通常,为了让DIV子元素超出部分隐藏,都是在父元素设置overflow:hidden,这样即可防止子元素撑开父元素,使子元素能够溢出隐藏!

但是,对于position:absolute定位的子元素,仅仅使用overflow:hidden没办法将其溢出部分隐藏,需要在父元素上也加上一个定位position:relative才能将含有position:absolute属性的子元素进行溢出隐藏!

绝对定位元素相对的元素是它最近的一个祖先,该祖先满足:position的值必须是:relative、absolute、fixed,若没有这样的祖先则相对于body进行定位。偏移值由其top、bottom、left、right值确定。

而绝对定位的元素若超出其父元素的边界,要想将溢出的部分隐藏,则,想隐藏在哪个祖先里,该祖先必须同时设置position:relative/absolute/fixed和overflow:hidden的值。

2、绝对定位常见误区:

通常我们常听说:CSS绝对定位在没有其他有除static定位的包含块的情况下是以body进行定位,如果要想相对当前元素的父元素来定位,父元素一定要设置position:relative。

注意,前面一句是没有问题的,在没有父元素设置定位的话,默认就是以body来定位的,但是后面一句,要想相对父元素定位,父元素必须设置相对定位(relative),根据我的开发经验和查阅相关资料确认后发现,这是不对的。

正确的理解姿势是:

相对定位:相对于块级元素(或行内块)自身位置进行定位;

绝对定位:绝对定位的盒子是相对于 离它最近的一个已定位的盒子进行定位的(默认是body);

PS:注意是最近的盒子,而不是最近的父元素

注意:css描述的绝对定位概念,没有说明是离他最近的一个已相对定位的盒子进行定位的,所以离他最近的盒子的定位可以是相对定位(relative)和绝对定位(absolute)的,但是在开发中,一般是父盒子设置相对定位的,但是不代表只能是相对定位。

overflow是什么意思

overflow

[英][ˌəʊvəˈfləʊ][美][ˌoʊvərˈfloʊ]

vt.&vi.溢出,淹没挤满,充满洋溢资源过剩

n.泛滥,溢出物溢流管充溢,过多超出额

vi.泛滥,溢出充溢

adj.溢出的,满出的

双语例句

1.A recursive definition like this is going to fill up the stack rapidly and lead to a stackoverflow.

像这样的递归定义很快就会填满堆栈,从而导致堆栈溢出。

2.The river used to overflow, drowning whole villages.

过去这条河常常泛滥,淹没了整个村庄。

3.Energy Secretary Stephen Chu told an overflow audience at Beijing's TsinghuaUniversity that climate change is a growing and urgent problem.

美国能源部长朱棣文在北京清华大学对挤满会场的听众们说,气候变化问题日益严峻,而且十分紧迫。

overflow hole是什么意思

overflow hole

溢流孔

The resin injection hole is set at the centre of the mold and overflow hole on the conners.

注胶孔设在阳模的对称中心,溢胶孔设在阳模的四个角上。

buffer overflow是什么意思

buffer overflow

[英][ˈbʌfə ˌəuvəˈfləu][美][ˈbʌfɚ ˌovɚˈflo]

n.

缓存溢出错误

双语例句

1

Mutiple buffer overflow vulnerabilities exist in the Session Initiation Protocol ( SIP) channel driver in Asterisk Open Source.

Asterisk Open Source的会话初始化协议(SIP)通道驱动程序中存在多个缓冲区溢出漏洞。

numeric overflow是什么意思

意思:数值溢出。

如果还有什么疑问,请继续“追问”

如果对我的回答满意,请点击右侧“满意”,非常感谢。

queue overflow是什么意思

queue overflow

生词本

英 [kju: ˌəuvəˈfləu] 美 [kju ˌovɚˈflo]

队列溢出,排队溢出

网络释义

相关词条

termination queue overflow

shallow overflow是什么意思

shallow over flow

浅流

重点词汇释义

over flow溢流口

stack overflow是什么意思

stack overflow

英[stæk ˌəuvəˈfləu] 美[stæk ˌovɚˈflo]

[词典] 栈溢出

[例句]Fix for stack overflow vulnerability which could allow arbitrary code execution.

修复了一个可能导致执行任意代码的缓冲区溢出漏洞。

overflow:hidden是什么意思?

CSS中,overflow:hidden的作用是隐藏溢出

比如:<div class="page_speeder_1313888563" id=1><div id=2></div><div>

当ID=2的这个DIV高度设定的宽度超过了300px,那么超出的部分将自动被隐藏。

initial overflow是什么意思

initial overflow

初始溢出

如果您有什么疑问和不解之处,欢迎追问我!

如果您认可我的答案,请采纳。

您的采纳,是我答题的动力,O(∩_∩)O谢谢