简单来说响应式就是根据不同的宽度来调用css
1、简单的来说要共用电脑端css的话就是media 来就行了!
@media only screen and (max-width: 640px) { html,body{max-width:640px; margin:0px auto;} }
2、如果不共用css的话!就下面咯!
<link rel="stylesheet" type="text/css" href="../css/main.css" media="screen and (max-width:1200px)"/> <link rel="stylesheet" type="text/css" href="../css/sj_main.css" media="screen and (min-width:1201px)"/>
3、如果你还要就用脚本咯!但是这个不是很适合你这种喜欢拖啊拖的了变得了!只有第一次生效!
<link rel="stylesheet" type="text/css" id="links" href="../css/m_main.css"/> <script type="text/javascript"> window.onload=function(){ var sc=document.getElementById("links"); if(window.screen.width>1024) //获取屏幕的的宽度 { sc.setAttribute("href","../css/main.css"); //电脑 } else{ sc.setAttribute("href","../css/m_main.css"); //手机 } } </script>