媒体查询 为什么不管怎么设置，后面的都会覆盖前面的设置

Question

在index.less文件里最后有一行@import'media';

在media.less文件里内容为

@media (min-width: 768px) {

    #content-wrapper {

        margin-left: 200px;

    }

}

我想达到 大于768px的设备margin-left: 200px; 小于768px的设备margin-left: 0px; 该怎么写呢？

我试了在@media (min-width: 768px) {}前或后写@media (min-width: 320px) {}，不管设备是多大分辨率，后面的都会把前面的覆盖

Answer 1

怎么解决的？

Answer 2

@media=" only screen and (min-width:768px)"{ #content-wrapper {         margin-left: 200px;     } } @media=" only screen and (min-width:768px) and (max-width:320px)"{ #content-wrapper {         margin-left: 0px;     } }