一个css样式表中的媒体查询差异屏幕大小

您好，我有这个脚本，我需要当屏幕大小为1600像素时，背景色为红色，当屏幕大小为1366像素时，背景色为黑色，但我的代码不工作，媒体查询仅工作1600像素

html

---

第二种样式覆盖第一种样式。改变顺序。它会起作用的

 div{
width:100%;
height:100%;
background-color:grey;
}

@media screen and (max-width:1600px){
   div
   {
    background-color:red;
   }
}

@media screen and (max-width:1366px){
   div
   {
    background-color:black;
   }
}

div{
    width:100%;
    height:100%;
    background-color:grey;
}

@media screen and (max-width:1366px){
    div{
        background-color:black;
    }
}

@media screen and (max-width:1600px){
    div{
        background-color:red;
    }
}

 div{
width:100%;
height:100%;
background-color:grey;
}

@media screen and (max-width:1600px){
   div
   {
    background-color:red;
   }
}

@media screen and (max-width:1366px){
   div
   {
    background-color:black;
   }
}