关闭

关于友好性测试中鼠标样式的修改

发表于:2015-8-24 10:49

字体: | 上一篇 | 下一篇 | 我要投稿

 作者:天外归云    来源:51Testing软件测试网采编

  在日常的界面测试中,我们一定会有这样的CheckPoint:鼠标移到可点击标识的上方时是否变为小手。
  上图中的鼠标样式是错误的,要想修改成小手我们需要对应的找到他所对应页面元素的CSS样式并做修改(添加红字部分):
div[id$='icmbx'] {
display: inline-block;
border: 1px solid #bfbfbf !important;
/*width: 603px;*/
width:559px;
height: 48px;
margin-left: 20px;
cursor: pointer;
}
  这样修改后,鼠标移到输入框上方时就变成小手啦:
  但是当我们把鼠标移到旁边的小图案(或下三角箭头)上时,发现问题并没有完全改好:
  这是因为这个框框里有多层div嵌套导致的:
  要想解决这个问题需要继续修改CSS样式,添加如下的代码,让外层div中所有嵌套在内的div都能够继承外层div的CSS样式:
  div[id$='icmbx']>div{cursor:pointer}
  于是问题就彻底改好了,
  如果不加上最后一行代码的话,这个bug就不算彻底改好。当嵌套的div层数过多时,测试的疏漏会导致bug隐藏难以发现,所以在修改bug的时候一定要想到嵌套的情况以才能节省时间,避免bug被reopen。
div[id$='icmbx'] {
display: inline-block;
border: 1px solid #bfbfbf !important;
/*width: 603px;*/
width:559px;
height: 48px;
margin-left: 20px;
cursor: pointer;
}
div[id$='icmbx']>div{cursor:pointer}
《2023软件测试行业现状调查报告》独家发布~

关注51Testing

联系我们

快捷面板 站点地图 联系我们 广告服务 关于我们 站长统计 发展历程

法律顾问:上海兰迪律师事务所 项棋律师
版权所有 上海博为峰软件技术股份有限公司 Copyright©51testing.com 2003-2024
投诉及意见反馈:webmaster@51testing.com; 业务联系:service@51testing.com 021-64471599-8017

沪ICP备05003035号

沪公网安备 31010102002173号