之前这些小细节都在实践的时候给忽视了，或者都动态加载，框架的使用等因素的隐藏，变得不那么容易出现。

今天看到张鑫旭大牛的微博，觉得记录一下这个小问题的解决方案

    <div style=" padding-left: calc(100vw - 100%);">

         <div style="width:1200px;background:#ccc;height: 1000px;margin:0 auto;"></div>

    </div>

加了这句话就不会出现闪动问题，因为这样计算左边总会预留出来滚动条的宽度回没有滚动条为0；

100vw相对于浏览器的window.innerWidth，是浏览器的内部宽度，注意，滚动条宽度也计算在内！

而100%是可用宽度，是不含滚动条的宽度。但是calc还是有兼容问题，支持主流浏览器，记得加上内核使用。

css控制滚动条的出现隐藏导致的页面闪动的问题的更多相关文章

  1. css控制div显示／隐藏方法及２种方法比较原码 - czf164的专栏 - 博客频道 - CSDN.NET

    body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...

  2. CSS 控制滚动条样式

    /*作为IT界最前端的技术达人,页面上的每一个元素的样式我们都必须较真,就是滚动条我们也不会忽略.下面我给大家分享一下如何通过CSS来控制滚动条的样式,代码如下:*/ 1 /*定义滚动条轨道*/ #s ...

  3. CSS - 控制最后边框的隐藏或设置为none

    div{       width: 20%;       border-left: 1px solid $border-color;       &:nth-child(5n+1){      ...

  4. CSS控制文本超出后隐藏并用省略号代替

    一.仅定义text-overflow:ellipsis; 不能实现省略号效果. 二.定义text-overflow:ellipsis; white-space:nowrap; 同样不能实现省略号效果. ...

  5. CSS控制滚动条的样式

    到今天(2018年10月25日)为止, 这还是chrome上的一个实验性特性: ::-webkit-scrollbar{width:4px;height:4px;} ::-webkit-scrollb ...

  6. CSS 控制Html页面高度导致抖动问题的原因

    CSS 控制Html页面高度导致抖动,这类由高度导致页面抖动的问题,其实究其根本原因是滚动条是否显示导致的 在CSS中添加如下代码: html,body{ overflow-y:scroll;} ht ...

  7. python+selenium：解决上传文件<input type='file'>标签属性被css的visibility隐藏导致无法定位元素的问题

    要想上传文件,需要找到在HTML中<input type="file" />这个标签,有它就可以利用send_keys上传文件,不过这里的<input>元素 ...

  8. css设置滚动条颜色与样式以及如何去掉与隐藏滚动条

    我们大家在浏览网页的时偶尔会看到很漂亮的各种颜色样式的滚动条,这就是通过css代码控制来实现的,于是本人搜集整理一番,这里和大家分享一下使用CSS设置滚动条颜色以及如何去掉滚动条的方法,需要的朋友可以 ...

  9. 功能整合（一）：滚动条的变相隐藏、js控制div的渐变显示、滚动条监听

    1.滚动条的变相隐藏 思路: 1.  把body的横向,纵向的超出部分隐藏,宽设置100%:高设置100%.就没有body的滚动条了, 2.  然后把最外层的div的宽设置的比body的宽宽一点,把d ...

随机推荐

  1. C#基本方法（瞎写写）

    public static IEnumerable<T> GetAll<T>() where T : new() { using (var conn = new Profile ...

  2. 20180706001 - 动态添加 tabPage

    //        public TabPage Add(Form form, string str_frm_name)        {            form.Visible = true ...

  3. redis缓存数据库

    redis 介绍 redis是业界主流的key-value nosql 数据库之一.和Memcached类似,它支持存储的value类型相对更多,包括string(字符串).list(链表).set( ...

  4. pam密码策略

    PAM 的使用历史 PAM 是关注如何为服务验证用户的 API.在使用 PAM 之前,诸如 login(和 rlogin.telnet.rsh)之类的应用程序在 /etc/passwd 中查找用户名, ...

  5. 深度学习网络中numpy多维数组的说明

    目前在计算机视觉中应用的数组维度最多有四维,可以表示为 (Batch_size, Row, Column, Channel) 以下将要从二维数组到四维数组进行代码的简单说明: Tips: 1) 在nu ...

  6. 使用bootstrap-select有时显示“Nothing selected”

    .html()后加 $('#courseList').selectpicker('refresh'); $('#courseList').selectpicker('render'); 来源

  7. mybatis第一次搭建出错

    ### Error building SqlSession. ### The error may exist in com/test/pojo/UserMapper.xml ### Cause: or ...

  8. springboot2.0 JPA配置自定义repository，并作为基类BaseRepository使用

    springboot2.0 JPA配置自定义repository,并作为基类BaseRepository使用 原文链接:https://www.cnblogs.com/blog5277/p/10661 ...

  9. 第 9 章 数据管理 - 075 - 配置 VirtualBox backend

    配置 VirtualBox backend 在 VirtualBox 宿主机上启动 vboxwebsrv 服务: C:\Program Files\Oracle\VirtualBox > VBo ...

  10. 外排序 External sorting

    2019-04-17 18:11:34 外排序(External sorting)是指能够处理极大量数据的排序算法.通常来说,外排序处理的数据不能一次装入内存,只能放在读写较慢的外存储器(通常是硬盘) ...