当 devicePixelRatio = 1.5 时，Webview 中的 CSS 1px 边框在某些边上提供 2px 边框答案

【问题标题】：CSS 1px border in a Webview gives 2px border on some sides, when devicePixelRatio = 1.5当 devicePixelRatio = 1.5 时，Webview 中的 CSS 1px 边框在某些边上提供 2px 边框
【发布时间】：2018-03-21 20:14:57
【问题描述】：

我正在使用 WebView（=应用程序中的嵌入式浏览器）的 Android 应用程序中加载一个页面，并使用标准设置：

mywebView = (WebView) findViewById(R.id.activity_main_webview);
...
mywebView.loadUrl("http://example.com/test");

除了以下小问题外，一切正常：

问题：1像素宽的边框显示不正确：边框的四个边中的一个或两个是2px而不是1px。看起来像这样：

我注意到我的设备上有window.devicePixelRatio = 1.5

这是 HTML 代码（我不使用代码 sn-p，因为它们无论如何都不能在移动设备上运行）：

<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style type="text/css">
#test { display: inline-block; border: 1px solid #c4c4c4; padding: 9px; }
</style>
</head>
<body>
<a id="test">Test</a>
</body>
</html>

this question 中给出的解决方案（我在那里放了赏金，所以我已经测试了答案）不起作用：border: 0.5px solid black; 或 border: 0.75px solid black; 显示 根本没有边界，所以这不是重复的。这是devicePixelRatio = 1.5 时的特定问题（它的行为不同于1 或2）
Live demo here，我无法在 Android 版 Chrome 中重现该问题，但只能在使用 WebView 并显示相同页面的 Android 应用中（奇怪，不是 @987654335 @使用与Chrome相同的渲染引擎？）

【问题讨论】：

标签： android html css android-webview border

【解决方案1】：

我只是有一个类似的问题，它已经解决了，如果这个解决方案对你有帮助，我不知道：

这有助于为 div 留出一个边距

.brand .col-8 {
    padding-right:0;
    margin-right:-1px;
}
.brand .col-4 {
    border-left:1px solid #d8d8d8;
}

【讨论】：