3

我遇到了这样一个问题，即我的 iPhone 4 等显示器的设计概念包括 1px 边框，我不知道 Retina 设备以 2x 的纵横比测量 CSS。

因此，我开始利用max-device-width:640px（用于纵向）的媒体查询来设计页面，并认识到如果我将视口元设置为initial-scale=.5.

问题是：如果我不想initial-scale=.5在 iPhone 的实际像素尺寸中设置和定义媒体查询，似乎没有办法在 Retina 显示器上实现 1px 宽的边框等，因为设置border:.5px将强制 iOS 计算它的整数值 - 这似乎导致 0 而不是 1。

4

2 回答 2

4

这就是我在 iPhone 上实现 1px 边框的方式（在 iPhone 5 上测试）。

HTML
<span class="hr"></span>

CSS
.hr {
    display: block;
    width: 100%;
    border-bottom: 1px solid black;
    -webkit-transform: scaleY(0.1);
}

显然，这使得将 1px 边框应用于任何实际充当容器的东西变得很棘手，但它会为真正的 1px 分隔符解决问题。

于 2013-12-10T05:07:36.290 回答
0

你可以试试：

border: thin solid black;
于 2021-04-13T02:48:16.653 回答