只做一个网页单页,怎么让其区分为电脑浏览器和手机浏览???

2020-06-13 科技 65阅读



Bootstrap<&><br><meta name="viewport" content="width=device-width, initial-scale=1.0"> <br><meta charset="utf-8" &> <br><link href="<a href=" http: target="_blank" rel="nofollow noopener">http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"><br><script src="<a href=" http: target="_blank" rel="nofollow noopener">http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script><br /><script src="<a href="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js" target="_blank" rel="nofollow noopener">http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"></script><br /><!--[if lt IE 9]><br /> <script src="<a href="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js" target="_blank" rel="nofollow noopener">https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script><br /> <script src="<a href="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js" target="_blank" rel="nofollow noopener">https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script><br /> <![endif]--><br /></head><br /><body><br /><div class="visible-sm">768px < X < 991px</div><br /><div class="visible-md">992px < X < 1199px</div><br /><div class="visible-lg">>1200px</div><br /><div class="hidden-lg">不在电脑上显示:<1200px</div><br /><div class="visible-lg">只在电脑上显示:>1200px</div><br /></body><br /></html><br />拖动浏览器窗口大小,查看效果<br />实现原理:CSS媒体查询, 比如下面这个类只在1200px以上的时候起作用<br />@media (min-width: 1200px)<br />.visible-lg {<br />display: block!important;<br />}</script></&>
声明:你问我答网所有作品(图文、音视频)均由用户自行上传分享,仅供网友学习交流。若您的权利被侵害,请联系fangmu6661024@163.com