                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /如何用CSS进行网页布局

关于绝对定位的问题

我想问一下在这个视频里面为什么拖动窗口的时候文字内容没有被覆盖但是自己做出来的效果文字会被覆盖住而且绝对定位的特点不就是会重叠吗视频中的效果是什么原因？

慕九州7538876

2016-10-16

源自：如何用CSS进行网页布局 4-1

关注问题我要回答

1268

操作

收起

3 回答

黑白灰菌回答被采纳 +3 积分
2016-10-16

我所理解的是：绝对定位是会脱离文档流的，左侧div和右侧div设置了绝对定位直接无视文档流处在该处的位置。中间的div是普通流，它设置了一个margin-left和margin-right，就是视频中的margin：0 300px 0 200px，所以不会和左侧右侧重叠，我没有理解你说的文字内容没有被覆盖是什么意思，方便的话可以放出你的代码。

0 回复有任何疑惑可以回复我~

#1

慕九州7538876 提问者

我把代码和截图放到评论里了麻烦你帮忙看看谢谢了

2016-10-16 回复有任何疑惑可以回复我~

#2

黑白灰菌回复慕九州7538876 提问者

我看了你的截图，你把那些字母换成汉字试试，就会随着窗口自动缩放了。因为你那些字母连在一起会被认为是一个单词，它是不会换行的，就像汉字他不会只显示一半。

2016-10-17 回复有任何疑惑可以回复我~

#3

慕九州7538876 提问者

非常感谢！

2016-10-17 回复有任何疑惑可以回复我~

慕九州7538876 提问者
2016-10-16

结果是这个样子

0 回复有任何疑惑可以回复我~

离玮
2016-10-16

为什么拖动窗口的时候文字内容没有被覆盖?是因为中间那列属于自适应宽度，文字内容会随着宽度自动进行换行显示。你说你做出来的效果文字会被覆盖住，我觉得是因为你没有对中间那列的margin进行相应的设置。

position:absolute; 绝对定位特点

a、使元素完全脱离文档流；

b、使内嵌支持宽高；

c、块属性标签内容撑开宽度；

d、如果有定位父级相对于定位父级发生偏移，没有定位父级相对于document发生偏移；《需要添加body的位置即：body{positive relative}》

e、相对定位一般都是配合绝对定位元素使用；

f、提升层级《不会被后面覆盖，不保留原来的位置》

0 回复有任何疑惑可以回复我~

#1

慕九州7538876 提问者

谢谢你的回复 margin我设置了你看看我回答的截图麻烦你了

2016-10-16 回复有任何疑惑可以回复我~

举报

0/150

提交

取消

如何用CSS进行网页布局

参与学习 209624 人
解答问题 1153 个

用最简洁的案例教你布局的那些知识，这是前端工程师基本技能

关于绝对定位的问题

我要回答关注问题

意见反馈帮助中心 APP下载