Media queries for tablet min-resolution and max-resolution

Question

Currently working on a responsive design website. I use media query for targeting different devices based on the width and screen resolution.

1. I have a scena

Answer 1

These MQs will handle the preset settings in the Windows8.1 simulator:

@media screen and (resolution: 96dpi) and (max-width: 512px) and (device-aspect-ratio: 1024/768),
  screen and (resolution: 96dpi) and (max-width: 683px) and (device-aspect-ratio: 1366/768),
  screen and (resolution: 96dpi) and (max-width: 960px) and (device-aspect-ratio: 1920/1080),
  screen and (resolution: 96dpi) and (max-width: 1280px) and (device-aspect-ratio: 2560/1440) {
  body {
    background-color: red !important;
  }
}

@media screen and (min-resolution: 130dpi) and (max-resolution:140dpi) and (max-width: 960px) and (device-aspect-ratio: 1920/1200),
  screen and (min-resolution: 130dpi) and (max-resolution:140dpi) and (max-width: 720px) and (device-aspect-ratio: 1440/1080),
  screen and (min-resolution: 130dpi) and (max-resolution:140dpi) and (max-width: 960px) and (device-aspect-ratio: 1920/1080) {
  body {
    background-color: violet !important;
  }
}

@media screen and (max-resolution:  174dpi) and (min-resolution: 172dpi) and (max-width: 1280px) and (device-aspect-ratio: 2560/1440)  {
  body {
    background-color: purple !important;
  }
}