使用CSS3计算calc和vw单位巧妙实现滚动条出现页面不跳动

                                            <table class="text"&gt;<tbody><tr class="li1"&gt;

<td class="ln"><pre class="de1">1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

一个（ 使用主体也是可以实现类似效果， 不过本着宽度分离原 则， 不推荐） ； calc是CSS3中的计算， IE10+浏览器支持， IE9浏览器基本支持(不能用在background-position上)； 100vw相对于浏览器的window.innerWidth， 是浏览器的内部宽度， 注意， 滚动条宽度也计算在内！而100%是可用宽 度， 是不含滚动条的宽度。 calc(100vw - 100%)就是浏览器滚动条的宽度大小（ 如果有， 如果没有滚动条则是0） ！左右都有一个滚动条宽度（ 或都 是0） 被占用， 主体内容就可以永远居中浏览器啦， 从而没有任何跳动！ 兼容性:IE9+以及其他现代浏览器。 缺点:窄屏幕宽度下的处理。 浏览器宽度比较小的时候， 左侧留的白明显与右边多， 说不定会显得有点傻。 那么就在响应式的 时候进行如上处理。 http://www.zhangxinxu.com/wordpress/2015/01/css-page-scrollbar-toggle-center-no-jumping/