div 元素未选取外部样式

Question

我对 CSS 比较陌生，所以如果下面有愚蠢的错误，请告诉我。在尝试 w3cschools 上的示例之一时，我使用了以下代码

<!DOCTYPE html>
<html>
<head>
<style>
div {
    background-color: lightgrey;
    width: 300px;
    border: 25px solid green;
    padding: 25px;
    margin: 25px;
}
</style>
</head>
<body>

<h2>Demonstrating the Box Model</h2>

<p>The CSS box model is essentially a box that wraps around every HTML element. It consists of: borders, padding, margins, and the actual content.</p>

<div>This text is the actual content of the box. We have added a 25px padding, 25px margin and a 25px green border. 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.</div>

</body>
</html>

结果是正确的，带有绿色边框和灰色背景文本。

然而，当尝试对外部 css 执行相同操作时，如下所示。

此代码在thumbnailTest.css

.dics{

    background-color: lightgrey;
    width: 300px;
    border: 25px solid green;
    padding: 25px;
    margin: 25px;

}

这是HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css"
    href="C:\Users\Sam\Documents\workspace\test_project\cssTest\thumbnailTest.css">


</head>
<body>

    <div class="dics">This text is the actual content of the box. We have added a
        25px padding, 25px margin and a 25px green border. 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.</div>



</body>
</html>

未复制相同的输出，它显示为纯文本且没有样式。

虽然 css 的路径是正确的，但我也尝试过放置相对路径，但它不起作用

css 包含没有问题，因为它适用于我使用过的许多其他样式，但对于 Div 它不起作用

这是所需的工作区图片

Answer 1

用这个

替换csslink

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

Answer 2

引用 css 文件时存在拼写错误。 thumbnailTest.css => thumbnailText.css

OP 已根据评论进行编辑并解决了他的问题。

div 元素未选取外部样式

External style not picked by div element

html

css

external

stylesheet