Détecter le type de périphérique pour accélérer le site Web

Question

Je voudrais trouver un moyen de détecter le type d'appareil des visiteurs afin de charger uniquement la feuille de style pertinente. (Css desktop ou mobile) En effet, le CSS bloque le rendu, donc, je voudrais éviter que 2 .CSS soit chargé à chaque fois (style.css ET mobile.css) Peut-être y a-t-il une autre façon de le faire? Cordialement,

Answer 1

<link rel='stylesheet' media='screen and (min-width: 701px) and (max-width: 900px)' href='css/medium.css' />

Au-dessus appliquera uniquement pour css appareil avec écran entre 701px et 900px.

Vous pouvez utiliser des requêtes multimédias et définir des points d'arrêt. Reportez-vous au lien ci-dessous pour plus d'informations.

https://responsivedesign.is/develop/browser-feature-support/media-queries-for-common-device-breakpoints/

https://css-tricks.com/resolution-specific-stylesheets/