我刚刚开始了一个非常简单的练习,我创建了一个简单的 html 文件和一个 css 文件(在 css 文件夹中),以了解有关 Angularjs 的更多信息。 练习从创建这 2 个文件开始(因此还没有 Angularjs)。
出于某种原因,css 文件无法在我的任何浏览器中呈现。 在 Chrome 上,我检查了 index.html 文件,然后单击资源,Css 文件就在那里!但它不起作用。
我不知道该怎么办,但这似乎是一个非常愚蠢的错误。 我在几个地方读到它可能与名为 nginx.conf 的文件有关
index.html
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Test Your Knowledge: Saturn</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div id="myQuizz">
</div>
</body>
</html>
css/样式.css
body { background-color: #fff; padding: 20px; }
#myQuiz {
font-family: 'Roboto', sans-serif; font-size: 16px; font-weight: 400;
width: 650px; height: 650px;
position: relative;
overflow: hidden;
color: #fff;
background: #000 url(.../images/background.jpg) no-repeat 0px 0px;
}
#myQuiz h2 {font-size: 3em; margin: 0px; font-weight: 100;}
#myQuiz h3 {font-size: 2.4em; margin: 0px; font-weight: 100;}
#myQuiz p { margin: 0px 0px 14px 0px; }
#myQuiz .btn{
display: inline-block;
cursor: pointer;
background-color: #c04b01;
color: #fff;
text-decoration: none;
padding: 5px 15px;
border-radius: 6px;
}
/* Intro */
#myQuiz .intro { position: absolute; top: 225px; left: 40px; width: 550px;}
#myQuiz .intro p { margin: 0px 0px 40px 0px; }
最佳答案
正如其他人所注意到的,您在 HTML div 标记内拼错了您的 id。因此,将 id="myQuizz"更改为 id="myQuiz"。
<div id="myQuiz"></div>
我创建了一个 fiddle ,它更正了 myQuiz 的拼写错误,并添加了一个通用背景以便您可以看到它。我也加了
background-size: 100%;
background-position: center;
只是为了让你能看到背景
关于html - 我的浏览器不解释我的 css 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33975281/