javascript - 如何在一行中为移动设备和桌面设备分配一个 css 值

Question

我有宽度为 190 像素的 HTML div，它在桌面上正常工作，但在移动设备上却不行，有没有办法判断连接是否来自桌面采用此值，否则采用此值？

这是我的代码:

document.querySelector('.article').style.width ='190px';

Answer 1

在你的 css 文件中

// Desktop
.article {
    width: 100px;
}


// Mobile
@media only screen and (max-width: 768px) {
    .article {
        width: 50px;
    }
}

这是 Media Queries .

在第一行中，我们没有任何限制，但是当屏幕宽度小于时，您覆盖当前值ONLY 768px