Twitter Bootstrap - 样式不显示在移动浏览器上答案

【问题标题】：Twitter Bootstrap - Styling does not display on mobile browsersTwitter Bootstrap - 样式不显示在移动浏览器上
【发布时间】：2015-08-13 23:20:40
【问题描述】：

我的网站位于http://www.elgami.com/

我正在使用 Twitter Bootstrap 进行样式设置。在桌面上一切正常，但我的样式不会显示在移动浏览器上，当然，除非我硬编码它。可能出了什么问题？

我的标题显示如下：

我的 css 文件位于 public_html 根目录的“css”文件夹中。

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Hypercycle™ - Personalize Your World.</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width; initial-scale=1.0;">

  <!-- Bootstrap -->
  <link href="css/bootstrap.min.css" rel="stylesheet">
  <link href="css/blog.css" rel="stylesheet">

  <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Raleway:400,800,900">
  <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Roboto:100,200,400,600">

  <link rel='stylesheet' href='typicons.font-master/src/font/typicons.min.css' />

</head>

【问题讨论】：

标签： css twitter-bootstrap mobile

【解决方案1】：

删除

 @media (min-width: 1200px) {

从你 blog.css 的第 32 行开始。它告诉浏览器仅在站点大于 1200 像素时对其进行样式设置。

【讨论】：

【解决方案2】：

完全删除@media 标记确实会影响布局（但这可能是我网站特有的问题），所以我做了以下操作：

@media (min-width: 0px) {
  .container {
    width: 100%;
  }

【讨论】：