使用twitter bootstrap的移动设备上更大的字体

Question

我想为我的应用程序制作更大的字体，其中CSS基于twitter bootstrap 3.我已经尝试过来自this question的解决方案，但它被bootstrap本身覆盖，我试过：

@media (max-width: 600px)
html {
  font-size: 130%; // strikethrough in chrome = inactive style
}

这就是我加载CSS的方式（引导文件是从凉亭中取出的）：

    <link href="bootstrap.css" rel="stylesheet">
    <link href="bootstrap-theme.css" rel="stylesheet">
    <link href="main.css" rel="stylesheet">

如何让max-width设备的字体更大？

---

编辑：添加!important不会改变任何内容。我可以看到bootstrap正在覆盖CSS中的字体：

body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
  background-color: #fff;
}

Answer 1

试试这个，它应该可以工作，但一定要在引导CSS之后包含代码

@media (max-width: 600px){
  html {
    font-size: 130% !important; // strikethrough in chrome = inactive style
  }
}

如果被body覆盖，请使用：

@media (max-width: 600px){
  body {
    font-size: 130% !important; // strikethrough in chrome = inactive style
  }
}

Answer 2

尝试在html 和主体上设置字体，然后在引导CSS之后加载css。

@media (max-width: 600px){
    html, body {
      font-size: 130%; // strikethrough in chrome = inactive style
    }}

Answer 3

您缺少媒体查询的大括号。没有这些大括号，媒体查询实际上不会适用于任何后续内容。

@media (max-width: 600px) 
{
    html {
        font-size: 130%; // strikethrough in chrome = inactive style
   }
}

Answer 4

您在媒体查询周围缺少大括号，应该阅读

@media (max-width: 600px) {
html {
 font-size: 130%; // strikethrough in chrome = inactive style
 }
}