2-1 别把我和relative拴在一起
2.别把我和relative拴在一起
- 越独立越强大
大大的误区 - - 对于绝对定位的实现很多人都有这样一个误区
不如说:这张图片绝对定位于这个容器左上角的效果,首先给父元素设置一个position:relative;然后给图片position:absolute;left:0;top:0;
实际上这里的position:relative;和left:0;top:0;根本不需要,之所以大家会产生这样的误区主要是对绝对定位的理解不深刻!
为了让大家感性认知!
我给大家讲个故事吧~
魔鬼有两个妻子,一个是下等天使,一个是民间勇士,分别生了个儿子,跟天使生的就是绝对定位absolute,跟民间勇士生的就是浮动float,由于有恶魔血统,因此这两个儿子都具有破坏性,由于absolute的母亲是天使,因此,绝对定位absolute是具有天使基因的,是具有飞翔的潜力的,这个潜力会在后面华丽的展示,为了避免不必要的抚养烦恼,恶魔就让他的两个儿子浮动和绝对定位去民间成长了,于是问难题来的,由于两个孩子都具有破坏性,走到那里拿的建筑就要坍塌,或者不翼而飞,民众是很单纯的,他们可受不了,怎么办呢,于是魔鬼制作了一个法器,clear专门为浮动float收拾残局,同时,个了自己的一块肉幻化成relative,至于这里的relative怎么相对于绝对定位absolute的那就是relative系列的了,这里就不多说了...
事实上:
relativeheabsolute是分离的、绝对不是兄弟关系!虽然看上去有血缘关系
是事是:
以及,absolute越独立越强大!
也就是说,只要不跟relative打交道 ,绝对定位会更强大!
举个栗子
超越overflow~
独立的absolute可以摆脱overflow的限制,无论是滚动还是隐藏,如果这个overflow的值是hidden,这个关闭按钮也是不会被影藏的,即使他在做这个容器之外
下节预告:越独立越强大之定位——上辈子是折翼天使

浙公网安备 33010602011771号