样式设置 : div:hover { border:1px solid red;} 当鼠标移动到div时,产生抖动和偏移。
产生的原因: 是因为设置border时设置了1px边框,多出的这1px,与其它元素产生了挤压, 导致div偏移。
解决方法:

第一种方法:是先将这个div设置一个跟背景颜色一样的边框,比如背景颜色为#aaa;那么你先设置这个div的样式:div {border:1px solid #aaa;},然后再设置hover动作,div:hover { border:1px solid red;}。

第二种方法:将这个div的border颜色设置为透明

div {border:1px solid transparent;},

然后再引入hover动作

div:hover { border:1px solid red;} 。

css 对div用hover设置border,出现抖动和div走位问题,解决方法的更多相关文章

  1. OSS设置CORS规则以后还是报No 'Access-Control-Allow-Origin'解决方法

    OSS设置CORS规则以后还是报No 'Access-Control-Allow-Origin'解决方法 在OSS控制台设置了CORS规则以后,通过JS程序去调用的时候报No 'Access-Cont ...

  2. 子div块中设置margin-top时影响父div块位置的解决办法

    在css中设置样式时,通常会遇到用子div块margin中设置margin-top时,父div块中就会随着子div的margin-top,也会和子div执行相同的margin-top的位置样式 解决办 ...

  3. 子DIV块中设置margin-top时影响父DIV块位置的解决办法?

    解决方法: 1.修改父元素的高度,增加padding-top样式模拟(padding-top:1px:常用) 2.为父元素添加overflow:hidden:样式即可(完美) 3.为父元素或者子元素声 ...

  4. 子div块中设置margin-top时影响父div块位置的解决办法及其原因

    解决办法①: 若子DIV块中使用margin-top,则在父DIV块中添加:overflow:hidden; 解决办法②: 在子DIV块中用padding-top代替margin-top. 有个叫 b ...

  5. jQuery UI resizble、draggable的div包含iframe导致缩放和拖拽的不平滑解决方法

    前言 不仅仅是jQuery UI resizble的div包含iframe会导致缩放的不平滑,draggable也会出现包含iframe会导致拖放的不平滑,但是因为jQuery UI有为draggab ...

  6. div嵌套导致子区域margin-top失效不起作用的解决方法

    有两个嵌套关系的div,如果外层div的父元素padding值为0, 那么内层div的margin-top或者margin-bottom的值会"转移"给外层div,使父元素产生上外 ...

  7. 当Thread.Sleep的暂停时间参数设置过小时,精度很差的解决方法

    一.问题产生 在C#和C++中有这样一个函数:void Sleep(int Timeout),可以让线程暂停指定的毫秒数. 但是我在win8下调用这个函数实现按照固定频率发送udp数据包时,会有一个问 ...

  8. oracle安装报错[INS-30131]执行安装程序验证所需的初始设置失败(无法访问临时位置)解决方法!

    最近在电脑上安装oracle12c,安装时,在执行检查环境步骤时候报错: [INS-30131]执行安装程序验证所需的初始设置失败(无法访问临时位置) 最后在网上搜索解决方法,特记录下,以防以后再用到 ...

  9. 关于Windows2008服务器设置MIME后仍然无法播放MP4的解决方法

    最近遇到了一个非常邪门的故障,重新安装了Windows2008服务器后 Mp4无法正常播放: 整个互联网中关于设置MP4的方法基本都是教你如何在IIS中设置MIME 本文讨论的不是如何教你设置MIME ...

随机推荐

  1. 21.Merge Two Sorted Lists 、23. Merge k Sorted Lists

    21.Merge Two Sorted Lists 初始化一个指针作为开头,然后返回这个指针的next class Solution { public: ListNode* mergeTwoLists ...

  2. Eclipse的下载地址

    下载地址:http://eclipse.org/

  3. 免费申请https

    https://blog.csdn.net/MariaOzawa/article/details/81877756 实测有效

  4. React Native登录注册页面实现空白处收起键盘

    其实很简单,直接使用ScrollView作为父视图即可.有木有很神奇啊,以前都还不知道呢.....

  5. Spring Cloud(6):保护微服务(Security) - OAuth2.0

    OAuth2是一个授权(Authorization)协议.我们要和Spring Security的认证(Authentication)区别开来,认证(Authentication)证明的你是不是这个人 ...

  6. es6 是否包含字符串判断

    字符串查找类 接下来介绍一些可以通过 ES5 PolyFill的方法,但是现在 ES6 原生实现了 Method Param Return Description includes() 需要验证是否被 ...

  7. linux下maven环境的搭建

    1.maven的下载 2.maven的安装和环境变量配置 系统环境linux centos7.2 x64 1.maven的下载 下载地址:https://mirrors.tuna.tsinghua.e ...

  8. 什么是梯度下降法与delta法则?

    梯度下降法就是沿梯度下降的方向求解函数(误差)极小值.delta法则是使用梯度下降法来找到最佳权向量.拿数字识别这个案例为例,训练模型的过程通常是这样的.输入为1万张图片,也就是1万个样本,我们定义为 ...

  9. sql注入02

    第一关:基于错误的get单引号字符型注入 第二关:基于错误的get整形注入 第三关:基于错误的get单引号变形字符型注入 第四关:基础错误的双引号字符型注入 第五关: 第六关 第七关:导出文件get字 ...

  10. 【VS开发】获取CPU tick tick 周期

    多核处理器时,__rdtsc()的使用-编程珠玑第一章 根据书中提供的代码清单1-5,可以完成对于多核处理器的cpu占用率的控制. 但是在使用GetCPUTickCount计时时,下面的算式会出现一点 ...