Load CSS resource only for mobile devices

<link href="css/d1.m.min.css?t=2.9" rel="stylesheet" media="screen and (max-width: 500px)" type="text/css" />

Another way is to use

handheld

on

media

attribute

<link rel="stylesheet" type="text/css" href="mobile.css" media="handheld"/>

PHP's way to load CSS file for

mobile

devices

if(stristr($_SERVER['HTTP_USER_AGENT'], "Mobile")){
    echo '<link rel="stylesheet" href="style-400.css" type="text/css" />';
}

Load CSS resource only for desktop

<link href="css/d1.min.css?t=2.9" rel="stylesheet" media="screen and (min-width: 501px)" type="text/css" />

Another way is to use

screen

on

media

attribute

<link rel="stylesheet" type="text/css" href="screen.css" media="screen"/>

Using PHP

if(!stristr($_SERVER['HTTP_USER_AGENT'], "Mobile")){
    echo '<link rel="stylesheet" href="style.css" type="text/css" />';
}

Note: Remember this always loads the

d1.m.min.css

but activates it only on screens having max width as

500px