Question

老老实实地厌倦了这些问题，因为它们似乎永远不适合我。我在编写网站时使用了firefox，但后来意识到我从未检查过chrome以查看它是如何在那里运行的，所以决定检查它并选择错误的res（Firefox选择正确的分辨率和查询但是Chrome选错了）。 / p>

我的电脑资源：1280 x 768 - 风景。

我的媒体查询适用于firefox（也应该在chrome上工作吗？）：

/*! Desktop 768 - 1280 x 768 */

@media only screen 
  and (max-height: 768px) 
  and (max-width: 1280px) 
  and (orientation: landscape) 
{
    #cover-art
    {
    height:330px;
    width:330px
    }

    #time-knob .btn, #volume-knob .btn
    {
     width: 100px;
    }
}

查询chrome拾取是（我为我的Imac 24制作）：

/*! Imac 24*/

@media only screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1920px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) 
{
    .knobs
    {
        margin-top:20%;
    }

    .btn-group, .btn-group-vertical
    {
        padding-top: 15px;
    }

    #time-knob .btn, #volume-knob .btn
    {
        width: 100px;
    }

    .mainplayback
    {
        margin-top:20%;
    }

    .swiper-button-next, .swiper-button-prev
    {
        top: 65%;
    }

    #home-blocks
    {
        margin-top:4%;
    }

    .empty-block, .home-block
    {
        padding: 70px 30px;
    }

    .empty-block i, .home-block i
    {
        width: 70px;
        height: 50px;
        font-size: 70px;
    }

    .empty-block h3, .home-block h3
    {
        font-size: 34px;
    }

    body
    {
        font-size:19px;
    }

    #cover-art
    {
        height:500px;
        width:500px
    }
}

Answer 1

尚未测试但我编辑了imac查询以获得高度和宽度：

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

现在让chrome读取我正确的查询！现在我需要测试Imac是否可以使用此更改读取其查询但应该可以工作;）

媒体查询适用于Firefox，但chrome会选择错误的解决方案/查询

1 个答案: