Question

我的网页在PC浏览器中工作正常，当我调整浏览器大小时，它会转到bootstrap图标，但在移动设备中，它无法正常工作。需要帮忙。这里有什么问题。我需要通过bootstrap进行移动视图。

<link rel="stylesheet" href="user/assets/css/style.css<?php echo "?v= " . date("h:i:sa"); ?>">
<link rel="stylesheet" href="user/assets/css/bootstrap.min.css" type="text/css"  />
<link rel="stylesheet" href="user/assets/css/bootstrap-responsive.css" type="text/css"  />
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<?php 
 session_start(); 
 ?>


 <nav class="navbar navbar-inverse">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>                        
      </button>
      <a class="navbar-brand" href="#">RedCellBD</a>
    </div>
    <div class="collapse navbar-collapse" id="myNavbar">
      <ul class="nav navbar-nav">


<?php


if(!isset($_SESSION['user']))
{
    echo '<li><a href="index.php" class="hbut"><span class="glyphicon glyphicon-home"></span> Home</a></li>';
    echo '<li><a href="donar.php" class="hbut"><span class="glyphicon glyphicon-search"></span> Donar</a></li>';
    echo '<li><a href="login.php" class="hbut"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>';
    echo '<li><a href="signup.php" class="hbut"><span class="glyphicon glyphicon-user"></span> Be a Member</a></li>';
    echo '<li><a href="offer.php" class="hbut"><span class="glyphicon glyphicon-bullhorn"></span> Campaign</a></li>';
    echo '<li><a href="faq.php" class="hbut"><span class="glyphicon glyphicon-question-sign"></span> FAQ</a></li>';
}
else
{
    echo '<li><a href="index.php" class="hbut"><span class="glyphicon glyphicon-home"></span> Home</a></li>';
    echo '<li><a href="donar.php" class="hbut"><span class="glyphicon glyphicon-search"></span> Donar</a></li>';
    echo '<li><a href="home.php" class="hbut"><span class="glyphicon glyphicon-user"></span> Profile</a></li>';
    echo '<li><a href="logout.php?logout" class="hbut"><span class="glyphicon glyphicon-log-out"></span>Logout</a></li>';
    echo '<li><a href="offer.php" class="hbut"><span class="glyphicon glyphicon-bullhorn"></span> Campaign</a></li>';
    echo '<li><a href="faq.php" class="hbut"><span class="glyphicon glyphicon-question-sign"></span> FAQ</a></li>';
  }
    ?>

 </ul>
 </div>
  </div>
</nav>

Answer 1

将其添加到标题中并检查

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Bootstrap网站在PC上运行良好但在移动设备上运行良好

1 个答案: