【问题标题】:My CSS won't apply to my html webpage我的 CSS 不适用于我的 html 网页
【发布时间】:2015-02-04 06:14:17
【问题描述】:

我最近下载了 Sublime Text 2,认为它可以简化像我这样的初级编码人员的流程。它确实如此,直到我的 css 文件停止生效。 html 文件如下所示:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" type="text/css" href="StyleSheet.css">
        <title>
        My Webpage Test
        </title>
    </head>
    <body>
    </body>
</html>

css 看起来像这样:

body {
    background-color: rgb(255,0,0);
}

像这样简单的CSS,我不明白为什么颜色(亮红色)不会生效!网页变成了一种奇怪的绿色。

请帮忙!

编辑:我想通了。问题是我有两个同名的 css 文件。感谢您的帮助!

【问题讨论】:

  • 在您的问题中发布您的代码,而不是您的代码图片。
  • 我试过了,但它只是变成了身体的一部分,看起来很乱。
  • 两个文件在同一个目录吗?
  • 我们可以帮忙清理。
  • 我知道您发布了 CSS 但重新打开样式表并确保它不包含 rgb(0,255,0) 而不是 rgb(255,0,0) 就像您发布的代码一样,因为第一个是亮绿色,而后者是红色。

标签: html css


【解决方案1】:

并更改css的名称

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" type="text/css" href="./style.css">
        <title>
        My Webpage Test
        </title>
    </head>
    <body>
    </body>
</html>

【讨论】:

    【解决方案2】:

    在正文中放置一个段落。示例:

    <body>
    
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
      tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
      quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
      consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
      cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
      proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
    
    </body>
    

    【讨论】:

      【解决方案3】:

      确保文件名正确,并且与您的代码中的大小写相同。

      重新打开样式表并确保它不包含 rgb(0,255,0) 而不是您发布的代码中的 rgb(255,0,0) ,因为第一个是亮绿色,而后者是红色。

      或者,您可以在您的 css 中使用 background: red;

      最后,您可能遇到了缓存问题。使用 Ctrl+Shift+R 或 Ctrl+F5 强制刷新页面(取决于您的浏览器)。

      对于那些说要确保正文有内容的人,正文不需要p 标记或其他任何东西来工作。 body 标签默认为可见区域。

      【讨论】:

      • 我只会添加,还要确保你的css文件的路径是正确的
      • 是的,尽管我忽略了这一点,因为 OP 在评论中说文件都在同一个目录中。
      猜你喜欢
      • 2016-11-30
      • 2022-11-03
      • 2020-06-09
      • 1970-01-01
      • 1970-01-01
      • 2018-07-25
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多