仅在计算机屏幕上应用 CSS 规则，而不是在手机和平​​板电脑上

Question

我的标题中有一个太小的徽标。 我发现这段代码可以增加大小，但我只希望它适用于计算机屏幕而不是手机或平板电脑。 代码是：

.site-title img   {max-width:100%; height:auto}
.site-description {display:none}

我想将100%更改为200%但仅在计算机屏幕上。

有人可以告诉我是哪个代码使这种情况发生的吗？

Answer 1

响应式网页设计，使用媒体查询：

@media screen and (min-width: 800px) {
    // this css will only be used when the screen size is min 800px
}

Answer 2

媒体查询用于将CSS规则仅应用于匹配的设备。 指定要应用样式规则的max-width或min-width 。

@media screen and (min-width: 720px) {
    body {
        background-color: skyblue;
    }
}

Answer 3

你有没有尝试过：

.site-title img {
    max-width:100%;
    width:0 auto;
    height:0 auto;
}

您是否也在尝试使其适合手机屏幕，或者我不太了解您。