在自学css开始就遇到问题，“链入外部样式表”在多浏览器显示问题

在自学css开始就遇到问题，“链入外部样式表”的习题，代码如下：
A、被链入的CSS文件代码.css
<style type="text/css">

</style>
--------------------------------------------------------------------------------
B、html习题页面代码.html
<html>
<head>
<meta charset="UTF-8">
<title>链入外部样式表</title>
<link rel="stylesheet" type="text/css" href="被链入的外部css文件.css">
</head>
<body>
<h1>编写外部CSS文件</h1>

<p>在HTML文件应用链入外部样式表方法调用外部CSS。</p>

</body>
</html>
-------------------------------------------------------------------------------
出现问题可多了~我一一道来

1、上面A、B代码不变，直接用IE打开，一切显示正常，我要的效果都有。但用
chrome和firefox打开，第一个元素标签（即h1哪行）没有CSS效果，后面两行（

即h3、p）效果正常。why？？

2、如果在B代码<html>前加入 <!DOCTYPE html>声明，结果页面效果和1一样（

第一行h1失去css效果，后两行正常）。why？？why？？

3、我用的习题答案全部要求在<style> </style>中间加入  ,解释说怕浏览器不认得css，可我看好多网页源码并没有这个奇怪的，看别的CSS书籍也没有这要求。于是我试着去掉它，结果神奇了，出现了和1、2一模一样的问题！！！！why？？why？？why？

我完全崩溃了~~~请教高人指点，不胜感谢~~~

/////////////////////////////

自己的问题自己答：

被链入CSS文件不许有html的CSS格式，即：

1 h1{background:gray;text-align:center;font-family:隶书}
2 h3{background:blue;text-align:center;font-family:隶书}
3 p{background:green;text-align:center;font-family:隶书}

这样就好了~