web-dev-qa-db-fra.com

Requêtes multimédias CSS pour Samsung s6

Aidez-moi, s'il vous plaît. Quelqu'un peut-il me parler des requêtes multimédias en CSS pour que Samsung s6 soit plus réactif?

Écran 
 @ média uniquement et 
 (largeur minimale de l'appareil: 360 pixels) et 
 (largeur maximale de l'appareil: 640 pixels) et 
 (- webkit-min -device-pixel-ratio: 3) {// code ici} 

Et d'où puis-je tester la conception réactive pour Samsung s6? Tout lien ou outil en ligne, s'il vous plaît?

12
Ali

J'ai essayé ceci:

@media screen 
  and (device-width: 360px) 
  and (device-height: 640px)
  and (-webkit-min-device-pixel-ratio : 4) 
  and (-webkit-device-pixel-ratio : 4)
  and (orientation: portrait) {

/* CSS GO HERE */

}

Et cela semble fonctionner. Pour S6 et S7. Je pense que c'est parce que les dimensions Samsung S6 et S7 sont 1440x2560:

1440/4 = 360
2560/4 = 640

J'espère que cette aide.

4
PositivProd

Les outils de développement Chrome peuvent vous permettre de tester la requête sur différentes tailles d'écran. Ouvrez la console développeur (F12) et cliquez sur le bouton "Basculer le mode appareil" (l'icône du petit écran). Vous pouvez sélectionner votre appareil ou définir manuellement la taille de l'écran vous-même. Pour une galaxie S6, les dimensions sont 360x640.

2
Matt O

Je vous recommande d'utiliser le code suivant:

/* Samsung Galaxy S6, S6+, S7, S7+ | 1440×2560 pixels ----------- */
/* Portrait and Landscape */
@media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 4) {
    /* Styles */
}

/* Landscape */
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 4) {
    /* Styles */
}

/* Portrait */
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 4) {
    /* Styles */
}

Si vous verrouillez la liste complète d'entre eux, veuillez vérifier ceci lien , vous trouverez les appareils suivants: Smartphones, iPads, iPads 3, iPhone 4, iPhone 5, iPhone 6, iPhone 6+, Samsung Galaxy S3 , Samsung Galaxy S4, Samsung Galaxy S5, Samsung Galaxy S6, Samsung Galaxy S7, Samsung Galaxy S8, Samsung Galaxy S9

Pour plus d'informations, veuillez regarder ceci lien et vérifier ceci lien

2
Alireza Nazari