Aide pour les médias uniquement

Bonjour, je me demande si vous pourriez m'aider avec un problème que je rencontre avec la mise en œuvre des écrans Media Only.

Je dois mentionner que je suis un programmeur débutant et que c'est la première fois que je développe un si gros morceau de code.

Je travaille actuellement sur le nouveau site Web de mon entreprise et j'ai terminé la page d'accueil. Je me concentre maintenant sur le rendre réactif aux appareils mobiles.

J'ai créé quelques éléments Media Only dans le fichier CSS de la page d'accueil, mais ceux-ci ne sont pas immédiatement appliqués aux appareils mobiles. Je dois également souligner que j'utilise FireFox Developer Edition, qui dispose d'un mode d'affichage des pages en mobile.

J'ai créé des écrans réservés aux médias et recherché en ligne les dimensions de la plupart des appareils mobiles, mais j'ai peur d'avoir les mauvaises dimensions. Auriez-vous la gentillesse de m'aider ?

Peut-être qu'une personne ayant de l'expérience en HTML et CSS pourrait bien vouloir fournir les dimensions correctes ?

Mon Code

media only screen and (min-width: 360px) and (max-width: 393px){}
@media only screen and (min-width: 412px) and (max-width: 428px){}
@media (min-width: 576px) and (max-width: 768px) {}

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!