您现在的位置是：网站首页> 编程资料编程资料
页面出现滚动条的时候如何让滚动条不影响页面宽度_心得技巧_网页制作_
2023-11-07
309人已围观
简介 这篇文章主要介绍了页面出现滚动条的时候如何让滚动条不影响页面宽度，需要的朋友可以参考下
设置body的宽度为window的宽度（以下脚本控制）
$("body").css("width", $(window).width());
同时设置body的overflow（样式里写）
body{ overflow-x: hidden;}
ps：
同理，div里面的table也是这样处理
设置tableContainer（样式里写）、tableMain（脚本控制）的宽度等于tableMainHead的宽度
$(".tableMain").css("width", $(".tableMainHead").css("width"));
设置tableContainer的overflow为hidden（样式里写）
这样做带来一个缺点，就是浏览器窗口大小变化的时候，body里面的内容不能自动居中（原本用百分比做宽度设置的div等是可以使用margin：auto自动居中的，现在将多出来的部分hidden了，就不能自动居中了）
$("body").css("width", $(window).width());
同时设置body的overflow（样式里写）
body{ overflow-x: hidden;}
ps：
同理，div里面的table也是这样处理
设置tableContainer（样式里写）、tableMain（脚本控制）的宽度等于tableMainHead的宽度
复制代码
代码如下:$(".tableMain").css("width", $(".tableMainHead").css("width"));
设置tableContainer的overflow为hidden（样式里写）
这样做带来一个缺点，就是浏览器窗口大小变化的时候，body里面的内容不能自动居中（原本用百分比做宽度设置的div等是可以使用margin：auto自动居中的，现在将多出来的部分hidden了，就不能自动居中了）
相关内容
- 美妆造型类网站 颜色搭配技巧的方案及效果展示_心得技巧_网页制作_
- 推荐一个前端工程师做的超酷交互式网站_心得技巧_网页制作_
- 一枚设计师再吐槽锤子官网_心得技巧_网页制作_
- 即将成为主流的2015—2016交互体验趋势_心得技巧_网页制作_
- 网页设计与西方建筑的发展历程有何相似之处_心得技巧_网页制作_
- 把握登录界面易用与安全的平衡的方法_心得技巧_网页制作_
- 让人想亲自体验的17个404页面_心得技巧_网页制作_
- 未来最成功的公司是技术公司还是设计公司？_心得技巧_网页制作_
- 创业公司精雕细琢的17个优秀网页设计_心得技巧_网页制作_
- 战争雷霆 机炮防御玩法介绍 机炮防御有什么技巧_手机游戏_游戏攻略_
