window版chrome 57.0.2970.0 (64-bit)滚动条的BUG
有一个元素div,它有一个子元素ul,给div添加一个:hover样式{color: red},挡鼠标hover div时,字体变红。
当鼠标hover div时,ul字体变红,鼠标hover ul的滚动条,同样会触发div的:hover,ul的字体仍然显示红色,在“window版chrome 57.0.2970.0 (64-bit)”环境下,鼠标滑过ul的滚动条,竟然没有触发div的:hover 样式,很诡异,浏览器不认为滚动条是ul的一部分!
解决办法是:自定义ul的滚动条样式
源码:
<html>
<head></head>
<body>
<style>
.demo ul{
width: 300px;
max-height: 200px;
border: 1px solid #ccc;
overflow-x: hidden;
}
/*::-webkit-scrollbar{
background-color: red;
}
::-webkit-scrollbar-thumb{
background: yellow;
}*/
.demo:hover{
color: red;
}
</style>
<div class="demo">
<ul>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
</ul>
</div>
</body>
</html>
window版chrome 57.0.2970.0 (64-bit)滚动条的BUG的更多相关文章
- API Monitor v2.0 Alpha-r13 (32+64) 汉化版
API Monitor v2.0 Alpha-r13 (32+64) 汉化版: 链接: https://pan.baidu.com/s/1jIx5znC 密码: 4538 本软件已最大化汉化,已经趋于 ...
- mac版chrome升级到Version 65.0.3325.18后无法打开百度bing搜狗
mac版本chrome升级到Version 65.0.3325.18后发现突然无法访问百度,搜狗,bing,神马等一系列的国内搜索引擎网站.连百度的儿子们比如知道,百度百科都无法访问. 1.首先想到的 ...
- 60.0.1(64位)windows版 uploadify使用有问题
http://mozilla.com.cn/thread-403024-1-1.html 60.0.1(64位)版,在使用uploadify插件,上传附件时,上传没有问题,可以成功,但执行上传成功后的 ...
- 配置Windows 2008 R2 64位 Odoo 8.0/9.0 源码开发调试环境
安装过程中,需要互联网连接下载python依赖库: 1.安装: Windows Server 2008 R2 x64标准版 2.安装: Python 2.7.10 amd64 到C:\Python27 ...
- Ubuntu14.04 64位机上安装cuda8.0 cudnn5.0操作步骤 - 网络资源是无限的
查看Ubuntu14.04 64位上显卡信息,执行: lspci | grep -i vga lspci -v -s 01:00.0 nvidia-smi 第一条此命令可以显示一些显卡的相关信息:如果 ...
- libnode 0.4.0 发布,C++ 语言版的 Node.js
libnode 0.4.0 支持 Windows ,提升了性能,libuv 更新到 0.10.17 版本,libj 更新到 0.8.2 版本. libnode 是 C++ 语言版的 Node.js,和 ...
- hadoop2.2.0伪分布模式64位安装
hadoop2.2.0伪分布模式64位安装用到的软件:jdk-6u45-linux-x64.bin,hadoop-2.2.0.x86_64.tar.gz 修改主机名vim /etc/sysconfig ...
- VS2015预览版中的C#6.0 新功能(二)
VS2015预览版中的C#6.0 新功能(一) VS2015预览版中的C#6.0 新功能(三) 自动属性的增强 只读自动属性 以前自动属性必须同时提供setter和getter方法,因而只读属性只能通 ...
- VS2015预览版中的C#6.0 新功能(三)
VS2015预览版中的C#6.0 新功能(一) VS2015预览版中的C#6.0 新功能(二) Using static 使用using StaticClass,你可以访问StaticClass类里的 ...
随机推荐
- transition,过渡效果
语法: transtion:property time change-speed delay. 人话就是:属性(property )在多少秒内(time )通过什么样的速度(change-speed) ...
- drozer工具的安装与使用:之二使用篇
如果英文好的同学可以直接查看官方文档 官方文档连接:https://labs.mwrinfosecurity.com/assets/BlogFiles/mwri-drozer-user-guide ...
- 图片的Base64编码
Base64编码是一种图片处理格式,通过特定的算法将图片编码成一长串字符串,在页面上显示的时候,可以用该字符串来代替图片的url属性. 我们可以来看一下实际的效果 Base64编码效果 在上图中,我们 ...
- linux 下安装 oracle
http://yourcouner.blog.51cto.com/59520/91156 一.RedHat AS4系统安装: 磁盘配置: 设备 类型 大小 / ext3 39911 swap 1024 ...
- Debian ifconfig 命令找不到
如何配置让 Debian 非特权用户也可以使用 ifconfig . ifconfig 在 /sbin 目录下,新建一个用户时, Debian 默认从 /etc/skel/ 复制配置文件, /sbin ...
- java多线程系列五、并发容器
一.ConcurrentHashMap 1.为什么要使用ConcurrentHashMap 在多线程环境下,使用HashMap进行put操作会引起死循环,导致CPU利用率接近100%,HashMap在 ...
- makefile 字符串处理函数
截取自<跟我一起写Makefile> (1) $(subst <from>, <to>, <text>) 名称: 字符串替换函数 subst 功能: ...
- saltstack自动化运维系列12配置管理安装redis-3.2.8
一.准备redis自动化配置的文件(即安装一遍redis,然后获取相关文件和配置在salt中执行上线) 1.源码安装redis3.2.8并注册为系统服务 安装依赖yum install -y tcl ...
- xcode 8 清除无用的打印
OS_ACTIVITY_MODE disable 虽然模拟器这样写能屏蔽掉无用的打印,但是在真机测试的时候什么都不会打印 Nslog 也打印不出来 , 这时候就要点掉 OS_ACTIVIT ...
- SpringMVC(2):Spring MVC入门
原文出处: 张开涛 2.1.Spring Web MVC是什么 spring Web MVC是一种基于Java的实现了Web MVC设计模式的请求驱动类型的轻量级Web框架,即使用了MVC架构模式的思 ...