问题已经解决，感谢所有帮助过我的人。问题是我在 css 文件中使用了 <.style> 标签，它是一个 HTML 标签，在 css 中没有被正确读取，导致发生了不同的事情。
我正在为我的 HTML 类(class)分配作业，并且正在进入 .css 以进行外部设置。
我一直注意到，当我将一个代码块移到另一个位置时，我的整个网页都发生了变化，但我移动的内容似乎“不再存在”。
我的CSS代码是
<style>
body { background-color: #6699ff;
color: #d5e3ff;
font-family: verdana; }
header { background-color: #6699ff;
color: #003366;
font-family: serif; }
h1 { line-height: 200%; }
nav { font-weight: bold; }
#category { font-style: bold;
background-color: #6699ff;
color: #003366;
font-size: 1.1em; }
footer { font-size: 0.60em;
font-style: italic; }
</style>
页面看起来像:http://i.imgur.com/eGthqWR.jpg
但是当我将正文移动到标题所在的位置时
<style>
header { background-color: #6699ff;
color: #003366;
font-family: serif; }
body { background-color: #6699ff;
color: #d5e3ff;
font-family: verdana; }
h1 { line-height: 200%; }
nav { font-weight: bold; }
#category { font-style: bold;
background-color: #6699ff;
color: #003366;
font-size: 1.1em; }
footer { font-size: 0.60em;
font-style: italic; }
</style>
页面最终看起来像这样... http://i.imgur.com/GxTfpTs.jpg
我真的很困惑为什么它只使用第二个“ block ”来实际获得页面应该是什么样子。
如果您也需要查看，我可以在我的索引页面中进行编辑，但我很确定这只是我如何对 css 文件进行编码的问题。
这是 Index.html
<!DOCTYPE html>
<html lang="en">
<link rel= "stylesheet" href="fishcreek.css">
<header>
<title> Fish Creek Animal Hospital </title>
<meta charset="utf-8">
<h1> Fish Creek Animal Hospital </h1>
</header>
<nav>
<a href="index.html">Home</a>
<a href="services.html">Services</a>
<a href="askvet.html">Ask the Vet</a>
<a href="contact.html">Contact</a>
</nav>
<body>
<dl>
<dt><strong>Full Service Facility</strong></dt>
<dd>Veterinarians and staff are on duty 24 hours a day, 7 days a week.</dd>
<dt><strong>Years of Experience</strong><dt>
<dd>Fish Creek Veterinarians have provided quality, dependable care for your <br>
beloved animals since 1984.</dd>
<dt><strong>Open door Policy</strong></dt>
<dd>Our Professionals welcome owners to stay with their pets during any medical <br>
procedure.</dd>
<dl>
1-800-555-5555 <br> 1242 Grassy Lane <br> Fish Creek, WI 55534
</dl>
</dl>
</body>
<footer>
<small><i>Copyright © 2014 Fish Creek Animal Hospital <br>
<a href="mailto:Johnathon@Olivas.com">Johnathon@Olivas.com</a></i> </small>
</footer>
</html>
如果有人知道我的问题是什么，或者为什么它看起来是那样的，我很想知道!提前致谢 - 约翰
作为该问题的临时解决方案，我能够添加一小行代码作为被跳过的“饲料”，并且 header 现在按预期方式工作，其余一切都按计划进行!
THEFIX! {background-color: #6699ff;}
这就是我必须做的一切并且它有效......有点，我只是希望我能弄清楚如何摆脱“thefix”以便在没有它的情况下工作。
感谢大家的帮助，抱歉，它的措辞不是很好，可能没有多大意义，但是是的...临时解决方法 ftw
最佳答案
你不应该使用<style>和 </style>在你的 css 文件中——它是一个 html 标签，而不是 css 语法。
你的情况是怎样的:
您正在尝试将 css 规则应用于 <style> body选择器或 <style> header选择器取决于顺序。你的 html 中没有这样的元素，所以它实际上不适用你的第一条规则。
关于html - 更改几行会给出不同的结果，即使它不应该，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32321593/