临沭县哪里有建网站的,电子商务网站建设费用,免费网站怎么建,郑州郑州网站建设河南做网站公司前言
今天在想调试一个开源 UI 框架的某个table row的隔行换色的样式设置#xff0c;发现这个颜色只有鼠标悬浮在row的时候才能拿到#xff0c;但是想要拷贝 row 样式#xff0c;鼠标必须离开悬浮区域#xff0c;去chrome的debug控制台内才能拷贝#xff0c;但是一离开悬…前言
今天在想调试一个开源 UI 框架的某个table row的隔行换色的样式设置发现这个颜色只有鼠标悬浮在row的时候才能拿到但是想要拷贝 row 样式鼠标必须离开悬浮区域去chrome的debug控制台内才能拷贝但是一离开悬浮区域样式又消失了顿时陷入了鸡生蛋的循环中。 通过在网上查找资料发现有博客说可以在悬浮row上右键单击然后到鼠标移动到chrome debug区域在键盘中输入N就行了经过几番尝试都以失败告终也不知道那位小伙伴写的误人子弟的文章可能是限制条件没说清楚只能在某些特殊情况触发。 最终还得靠 google 在 stackoverflow 上找到了通用的解决方法链接参考
css - See :hover state in Chrome Developer Tools - Stack Overflow 步骤
第一步
打开 chrome 控制台 按 F12 快捷键 或者 鼠标右击后选择检查然后找到要查看的 table row 比如我这里因为已经开启了隔行换色所以204是有颜色的205需要悬浮上才能变色如下 第二步 点击定位元素的图标然后选择205这一行的源码接着点击右键 强制执行状态 勾选hover勾选之后就可以固定这个样式了即使任意移动这个悬浮样式也不会消失。 注意这个时候要找谁的悬浮样式就点击那个元素即可推荐先点击 tr 看下如果没有悬浮设置就点击td继续看因为有些时候最终样式是设置在子元素上但是悬浮样式是设置在父元素上的比如我这个案例就是在子元素上 然后这个样式就是下面的这个
.ant-table-wrapper .ant-table-tbody tr.ant-table-row:hovertd