Question

我写了一块CSS，但它不会影响我的页面显示方式。我在我的HTML标签中使用：

<link rel="stylesheet" type="text/css" href="style.css" />

我的style.css文件如下所示：

@import('CSS/modal.css');
@import('CSS/menu.css');
@import('CSS/content.css');
@import('CSS/footer.css');
@import('CSS/title.css');

然而，当我使用它时：

#title {
  font-size: 5em;
}

测试它是否真的没有加载CSS。

在HTML的这一部分：

 <body>
    <div id="title">
      AMP
    </div>
 </body>

它仍然没有显示5em中的文字。

编辑：似乎当我将CSS3代码直接放入style.css并且不让它运行在@import（）函数上时，它确实正确加载，但为什么它不再工作？它昨天运作良好，它一直运作良好。

Answer 1

从选择器中删除.css：

#title {
  font-size: 5em;
}

#text.css选择器表示“选择同时具有title id和css class”的元素。

Answer 2

你至少有两个错误。

此：

#title.css {
  font-size: 5em;
}

应该是：

#title {
  font-size: 5em;
}

而且：

@import('CSS/modal.css');
@import('CSS/menu.css');
@import('CSS/content.css');
@import('CSS/footer.css');
@import('CSS/title.css');

应该是：

@import 'CSS/modal.css';
@import 'CSS/menu.css';
@import 'CSS/content.css';
@import 'CSS/footer.css';
@import 'CSS/title.css';

@import url('CSS/title.css');和@import 'CSS/title.css';都是有效的表单。你拥有的是无效的。

Answer 3

尝试：

#title {
 font-size: 5em;
}

这里的Jsfiddle有效：link