Kindle Fire HD10媒体查询答案

【问题标题】：Kindle Fire HD10 media queryKindle Fire HD10媒体查询
【发布时间】：2016-12-21 06:04:19
【问题描述】：

我需要为 Amazon Fire HD 10 编写特定的样式。到目前为止，我已经为其他版本编写了特定的样式。例如：Fire HD 7、Fire HD 8 等。以下是我当前的媒体查询代码。

@media only screen
    and (max-device-width: 1280px)
    and (max-device-height: 800px)
    and (orientation: landscape)
    and (-webkit-min-device-pixel-ratio: 1)

但此代码不适用于Amazon Fire HD 10。我怎样才能写Amazon Fire HD 10 特定样式..？我怎样才能只定位那个..？

【问题讨论】：

您可以访问该设备吗？（您现在可以使用它访问特定页面吗？）如果可以，您可以使用它并访问pieroxy.net/blog/pages/css-media-queries/test-features.html 以查看适用于它的媒体查询。
@ILoveCSS 非常感谢。明白了，我在路上。 :)

标签： css media-queries amazon kindle-fire

【解决方案1】：

我有一台 Kindle Fire HD10，所以按照 cmets 中 @user7234396 的建议，我需要将 -webkit-min-device-pixel-ratio 调整为 1.5

我也关注the advice of CSS-Tricks and use min and max device widths，而不是使用设备高度。

因此，要像您在问题中那样以横向定位此特定设备，您需要

@media only screen
    and (min-device-width: 800px)
    and (max-device-width: 1280px)
    and (orientation: landscape)
    and (-webkit-min-device-pixel-ratio: 1.5) {

}

显然是你需要的肖像

@media only screen
    and (min-device-width: 800px)
    and (max-device-width: 1280px)
    and (orientation: portrait)
    and (-webkit-min-device-pixel-ratio: 1.5) {

}

【讨论】：