media

link标签中使用

<link rel="stylesheet" type="text/css" media="screen and (orientation:portrait)" ;href="style.css">

判断屏幕是否是纵向，如果是就使用style.css这个样式

<link rel="stylesheet" type="text/css" media="screen and (max-width:960px)" href="style.css">

判断屏幕宽度是否小于960px，如果是则使用style.css这个样式

css文件中使用

@media screen and (min-width:960px){ 
    body{background:orange;}
}

当浏览器尺寸大于960px时候的代码了