CSS绝对定位和相对定位区别是什么?绝对定位后的图片还能自适应么?
展开全部
1:绝对定位和相对定位都需要参照物。
2:绝对定位的参照物是relative或者文档窗口,假设你的绝对定位的div有一个相对定位的父元素或者祖先元素,那么就是以该元素为参照物。例如
<div 相对定位> //根据这个祖先元素来做参照物的
<div 没有定位>
<div 绝对定位>//我得看爷爷div的脸色啊,幸好老爸不是相对定位
</div>
</div>
</div>
当他的祖先元素都没有相对定位时,就直接根据文档窗口来看了。
3:相对定位就容易多了,只要祖先元素是相对,绝对,或者文档窗口,都可以用来做参照物
4:你在一个标签里面设置了绝对定位,然后加一个img,只需要设置img的宽度100%,高度100%或者auto就行了,例如
<div style="width:100px;height:100px;position:absolute;">
<img src="" style="width:100%;height:100%;">
</div>
2:绝对定位的参照物是relative或者文档窗口,假设你的绝对定位的div有一个相对定位的父元素或者祖先元素,那么就是以该元素为参照物。例如
<div 相对定位> //根据这个祖先元素来做参照物的
<div 没有定位>
<div 绝对定位>//我得看爷爷div的脸色啊,幸好老爸不是相对定位
</div>
</div>
</div>
当他的祖先元素都没有相对定位时,就直接根据文档窗口来看了。
3:相对定位就容易多了,只要祖先元素是相对,绝对,或者文档窗口,都可以用来做参照物
4:你在一个标签里面设置了绝对定位,然后加一个img,只需要设置img的宽度100%,高度100%或者auto就行了,例如
<div style="width:100px;height:100px;position:absolute;">
<img src="" style="width:100%;height:100%;">
</div>
展开全部
DIV CSS中的绝对定位和相对定位的区别,我从网上看了好多,都没个详细的说法,其实也不用搞到那么复杂的。
先说相对定位:跟它的名一样,相
对嘛,要有一个参照物,但这个参照不是别的,是它自己呢,也就是说没设相对定位的位置,那你会问了,设没设都在那个位置为什么要设呢,因为只有设置了才能
使 TOP,LEFT这些生效,也就是设了才能相对自己原来的位置偏移,原来的位置保留着,偏移后会把其它的层遮罩住。
再说绝对定位:在布局里不
可能有绝对定位的,再怎么样都有一个参照位置的,绝对定位的参照位置就不像相对那样是自己了,至于是哪个,就看它的上级或上上级有没有定位了,也就是有没
有position:relative;或position:fixed了,好像position:inherit;也行,前面两个可以,后面那个不设什
么的不用也行,最好用position:relative;吧,转入正题,当要绝对定位的层设好要参照位置的层后,就可以用TOP,LEFT这些来定位置
了,如果它的上级或上上级都没定位的话只就会根据BODY的位置来定位了,还有最后一点,绝对定位是不占位置的,它会像PS的图层一样单独做一层,至于第
几层你可以通过z-index:这个属性来设置
对于图片自适应的问题你可以通过百分比来控制或者用@media screen来判断浏览器的宽度而执行css中图片的大小;
希望我的回答能帮到你;
先说相对定位:跟它的名一样,相
对嘛,要有一个参照物,但这个参照不是别的,是它自己呢,也就是说没设相对定位的位置,那你会问了,设没设都在那个位置为什么要设呢,因为只有设置了才能
使 TOP,LEFT这些生效,也就是设了才能相对自己原来的位置偏移,原来的位置保留着,偏移后会把其它的层遮罩住。
再说绝对定位:在布局里不
可能有绝对定位的,再怎么样都有一个参照位置的,绝对定位的参照位置就不像相对那样是自己了,至于是哪个,就看它的上级或上上级有没有定位了,也就是有没
有position:relative;或position:fixed了,好像position:inherit;也行,前面两个可以,后面那个不设什
么的不用也行,最好用position:relative;吧,转入正题,当要绝对定位的层设好要参照位置的层后,就可以用TOP,LEFT这些来定位置
了,如果它的上级或上上级都没定位的话只就会根据BODY的位置来定位了,还有最后一点,绝对定位是不占位置的,它会像PS的图层一样单独做一层,至于第
几层你可以通过z-index:这个属性来设置
对于图片自适应的问题你可以通过百分比来控制或者用@media screen来判断浏览器的宽度而执行css中图片的大小;
希望我的回答能帮到你;
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询