Question

我从上个月开始编码，并且正在使用Atom文本编辑器。我似乎无法将CSS代码链接到HTML

这是屏幕截图

CSS文件与HTML文件位于同一文件夹中，我在href部分中输入了确切的名称。

这是我的CSS。

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" type="text/css" href="index.css">
</head>

Answer 1

尝试一下

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

Answer 2

这是解决HTML和CSS的方法：

在浏览器中打开index.html。例如：Chrome
打开开发人员工具。如果使用的是Chrome，请右键单击并在菜单中单击检查。
将显示如下图所示。

在“元素”标签中，签入<head>并检查是否包含样式表。
如果包含它，请单击链接以查看它是否打开一个以原始文本作为样式的新页面。

例如：https://cdn.sstatic.net/Sites/stackoverflow/primary-unified.css?v=7f46f0b7e1bb

如果不是，那么您应该在上面关于路径的答案中进行尝试。
或者，尝试像这样将样式直接包含在<head>中：

    <head>
      <style type="text/css">
        body {
          background-color: blue;
        }
      </style>
    </head>
    <body>
      <h1>Test</h1>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing 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>

Answer 3

如果没有更准确的规格说明，我们通常可以尝试解决所有麻烦。这些是我的建议。 1上传之前，请小心保存文件。

2链接样式表，并使用相对路径，如之前的文章。

3添加CSS脚本的“文件版本”。这样，您的浏览器将重新加载所有CSS样式。（对您和以后的所有用户在编辑模板时非常重要）只需将其添加到链接样式表html标签

version=1.3

并在每次编辑CSS和上传文件时更改值

4 测试CSS ，您可以使用浏览器element inspector来测试CSS。

希望它会有用！

Answer 4

我认为您没有保存项目（选项卡上的蓝点）。首先通过Ctrl + S保存项目，然后查看页面。

Answer 5

最后关闭html标记，并确保将两个文件保存在同一文件夹中

在HTML文件中链接CSS

5 个答案: