响应式布局--引入外部样式

//当屏幕宽度小于480px的时候，引入demo.css

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

//当屏幕大于685px的时候，启用的css样式,(内联写法)

@media screen and (min-width : 685px){
　　.header-top,.search-left,.search-right,.header-nav,.header-nav ul{
　　　　padding: 0 !important;
　　}
　　.search-right input{
　　　　width: 200px !important;
　　}
}

响应式布局--引入外部样式

原文：http://www.cnblogs.com/toward-the-sun/p/4805267.html