Question

<html>    
    <head>
        <link rel="stylesheet" type="text/css" href="css.css"> - external stylesheet

        <div class = "idiot" href = "css.css">Purchase!</div>   
        <title></title>
    </head>
    <body>

    </body>

    <style type="text/css">
        .idiot { cursor:pointer; }
        .idiot:link { color: gray; }
        .idiot:visited { color: red; }
        .idiot:hover { color: black; }
        .idiot:active { color: blue; }  
    </style>
</html>

这里是外部样式表中写的内容 -

body { background-color:black; }

所以，我点击链接，但没有任何内容弹出，甚至根本没有发生任何事情。

Answer 1

您的代码有很多错误。头保留用于meta-标签，link，title等。您不能在其中定义元素（如div）。

您已将样式表正确链接到：

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

请确保检查href中的路径是否正确，并且css.css确实与HTML文件位于同一文件夹中。

从现在开始，所有样式都应在css.css内部完成。它会自动应用，因此您不必也不允许在href中使用div。您现在也无法单击任何内容，因为这将需要<a href="dest">Link</a>之类的内容。

这是一个代码段：

body { 
  background-color: green; 
}

.idiot {
  cursor: pointer;
  width: 100px;
  height: 100px;
  background-color: orange;
  color: black;
}

.idiot:link {
  background-color: gray;
}

.idiot:visited {
  background-color: red;
}

.idiot:hover {
  background-color: black;
  color: white;
}

.idiot:active {
  background-color: blue;
}

<html>
  <head>
    <title>title of the website</title>
    <link rel="stylesheet" type="text/css" href="css.css">
  </head>

  <body>
    <div class="idiot">
      Purchase!
    </div>
  </body>
</html>

确保将所有CSS代码放入样式表中。我为您的div添加了一些样式，以便您可以正确看到它们之间的区别。我还添加了background-color，以使差异更加明显，因为color仅对文本设置样式。

如何链接我的外部样式表？

1 个答案: