html定位
<div class="ds-wp ds-mg ds-diaod-ct">
<div class="ds-ct-top"></div>
<div class="ds-ct-img"></div>
</div>
.ds-wp{width:1200px;}
.ds-mg{margin:0 auto;}
.ds-diaod-ct{position:relative;}
.ds-ct-img{position:absolute;background:url(../images/ds1.png) no-repeat center center;width:377px;height:357px;top:0px;left:-250px; }我要是按照上面的写法整个1200px宽的div是自适应的，ds-diaod-ct不会被ds-ct-img这个div撑开，但是我要是把ds-ct-img设置成right:-250px;怎么整个ds-diaod-ct就出现横向滚动条了
展开
收起
1
条回答
写回答
写回答
-
IT从业题主的问题：“设置left：-250px，整个屏幕不会出现横向滚动条，整个屏幕是自适应的，要是设置right：-250px，整个屏幕就会出现滚动条，不再自适应了。这是为什么？”
自适应是CSS的一种布局方式，不是指你说的“不可见”，有点不准确啊，O(∩_∩)O哈哈~
默认情况下，浏览器进行页面布局基本过程是以浏览器可见区域为画布，左上角为（0,0）基础坐标，从左到右，从上到下从DOM的根节点开始画，题主描述的情况是有一部分内容超出了浏览器的可见区域，所以浏览器不绘制相应画面。
可以设置html的方向html{direction:rtl;}，这时候你就可以看到“设置left：-250px，整个屏幕会出现滚动条；设置right：-250px，整个屏幕不会出现滚动条”。
参考：Web底层剖析，浏览器是如何工作的
2019-07-17 19:43:07赞同 展开评论 打赏
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
相关问答
问答排行榜
最热
最新
相关课程
更多
推荐问答
