La siguiente pregunta lógica después de haber descubierto qué resoluciones usar es descubrir cómo aplicar diferentes estilos CSS para diferentes resoluciones.
Para aplicarlas, deberías usar el atributo @media de css, y se vería así:Resultado de imagen para responsive 
@media screen and (min-width: 320px) {
  body {
    background-color: red;
  }
}

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

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

Lo que hicimos aquí es establecer el ancho mínimo del dispositivo y estamos cambiando el color de fondo (como un ejemplo) basado en este ancho mínimo.Para ver esto funcionando, lo que podrías hacer es incluir esta hoja de estilo en tu archivo
 HTML:CSS

<link rel = "stylesheet" type = "text / css" href = "styles.css">1<link rel = "stylesheet" type = "text / css" href = "styles.css">

Si todavía estás averiguando qué resoluciones apuntar, echa un vistazo a esta publicación ".