Chrome浏览器中的粗边框问题

2cmtqfgy  于 2022-12-06  发布在  Go
关注(0)|答案(4)|浏览(527)

边框折叠在chrome浏览器中不能正常工作。一些边框线看起来很粗。请看这张图片并帮助我解决这个错误。
我需要为所有行精简边框。但突出显示的行边框看起来像粗体。为测试目的,请在链接中看到并删除背景色。请检查在 chrome 浏览器。https://www.w3schools.com/css/tryit.asp?filename=trycss_table_fancy

gtlvzcf8

gtlvzcf81#

这与用户缩放浏览器无关。这是Windows显示缩放比例,在某些设备上默认为125%。在浏览器缩放80%时,产生的边框折叠看起来正常,但在100%时看起来不正常。
我发现设置border: 0.5px solid;有效地解决了这个问题。

insrf1ej

insrf1ej2#

检查是否放大了页面?按Ctrl+0可将缩放重置为100%。
在样式中看不到任何可能导致此问题的东西。而且,根据分数缩放,效果与浏览器渲染错误非常相似。
Result size: 753x…可以假设你的屏幕宽度是1920 px,你把它放大到1. 25:-)

yhuiod9q

yhuiod9q3#

有多种方法可以实现这一点,自然在CSS边框或线条的最小宽度是1px不能低于1px。
我们不能让它更薄,但我们可以让它看起来更薄。
选项1:保持颜色接近背景色将使1px线条看起来比1px线条细
选项2:border-color:#dddddd50;降低颜色不透明度达到同样的效果,这里用50结尾的十六进制(dddddd)代码定义不透明度00 to 99请注意你不能在十六进制代码结尾加上100。
第一个

68de4m5k

68de4m5k4#

正如@robert-chapin在上面指出的,我的问题也是由Windows显示缩放设置为(推荐)125%。在CSS中更改边框大小没有帮助。对我来说最好的解决方案是简单地将Windows显示缩放比例更改为100%。现在我的表格边框在Chrome中看起来又正常了,而且我在屏幕上的位置更合适,因为所有东西都变小了。(顺便说一句,如果我将浏览器缩放到125%,那么我猜基本上又是同样的问题,粗边框再次出现)

相关问题