问题描述
由于某种原因，引导程序无法使我的网站（https://dylantn.github.io/Dusic/）自动兼容移动设备，因为我在手机上检查了该网站，而它只是桌面版的缩小版本
有人帮助
我感到沮丧 需要帮助<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="ind.css">
<title>Dusic-The Free Music Player Worldwide.</title>
</head>
<body>
<div class="container">
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-nav-demo" aria-expanded="false">
<span class="sr-only"><font face="arial"></font>Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="#" class="navbar-brand"><font face="arial"><span class="navimg"><img src="dusic4.gif" width="80" length="80" alt=""></span></font></a>
</div>
<div class="collapse navbar-collapse" id="bs-nav-demo">
<ul class="nav navbar-nav">
<li><a href="#"><font face="arial">About</font></a></li>
<li><a href="#"><font face="arial">Contact</font></a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#"><font face="arial">Sign Up</font></a></li>
<li><a href="#"><font face="arial">Login</font></a></li>
</ul>
</div>
</div>
</nav>
</div>
<div class="container">
<div class="jumbotron">
<div class="row">
<div class="col-lg-12">
<div id="content">
<h1><b><a href="#"><img src="dusic4.gif" width="250" length="250"></a></b></h1>
<h3><b>The Best Collection of Music That Ain't Worldwide...... MAN</b></h3>
<hr>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<h1>What is the purpose of Dusic?</h1>
<p>Our Society already has many music players,but i thought we need another one to clutter your life,plus it is Free!!</p>
<br><h3>IT IS FREE!! THAT IS THE ONLY COOL FEATURE ABOUT THIS THAT SEPERATES THIS FROM EVERYTHING ELSE<br>YIPEEEEE!</h3>
</div>
<script src="http://code.jquery.com/jquery-2.1.4.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</body>
</html>
解决方法
尝试将以下标签<meta name="viewport" content="width=device-width,initial-scale=1 maximum-scale=1 user-scalable=no" charset="utf-8">添加到您的head部分。
您可以在这里找到有关它的更多信息：https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag