Css chrome和屏幕像素报告的像素大小不一致_Css_Google Chrome

Css chrome和屏幕像素报告的像素大小不一致

css google-chrome

Css chrome和屏幕像素报告的像素大小不一致,css,google-chrome,Css,Google Chrome,我正在设计一个页面，并将div的大小设置为100px（80px高度+20px顶部填充）只是另一个博客 .... 但是当用Chrome渲染并截图时，我可以看到使用的颜料的大小实际上接近150px 我有一个144dpi的屏幕，不确定是否与此相关。我本以为这会得到很好的处理，因为它的大小是一个div，而不是一个图像我还遵循了说明，其中提到了Chrome在高DPI屏幕上的一个bug。我试着用上面提到的标志启动Chrome，强制Chrome进入高DPI模式，解决了这个问题。但其他网站似乎并没有

我正在设计一个页面，并将div的大小设置为100px（80px高度+20px顶部填充）


只是另一个博客
....

但是当用Chrome渲染并截图时，我可以看到使用的颜料的大小实际上接近150px

我有一个144dpi的屏幕，不确定是否与此相关。我本以为这会得到很好的处理，因为它的大小是一个div，而不是一个图像

我还遵循了说明，其中提到了Chrome在高DPI屏幕上的一个bug。我试着用上面提到的标志启动Chrome，强制Chrome进入高DPI模式，解决了这个问题。但其他网站似乎并没有像post所指的那个样存在问题，所以我想知道我是否应该通过CSS做些不同的事情来缓解这个问题

您可以看到Chrome报告div的高度为100px，但Paint的测量值为~150px

我在Windows8.1上使用的是Chrome49.0.2623.87M

谢谢

为什么要使用Paint进行web开发？为什么油漆告诉你div的大小很重要？如果在Chrome中div的高度是100px，那么这就是最重要的。我试图理解为什么Chrome报告的像素大小和屏幕像素大小之间存在差异。

.header {
    height: 80px;
    padding-top:20px;
    ...
}

<body>
    <div class="header">
        Just another blog
    </div>
    ....
</body>