Question

我正在尝试学习如何使用Cascadding样式表。我有一个小测试html页面如下：

<html>
<head>
<link rel="stylesheet" type="text/css" href="css/test.css" />
</head>
<body>
   <h3> A White Header </h3>
     <p> This paragraph has a blue font.  
      The background color of this page is gray because
   we changed it with CSS! </p>
  <INPUT TYPE=text NAME="userID" id="userID" Size=20 > 
</body>

外部css文件如下所示：

body{ background-color: gray;} 
 p { color: blue; } 
h3{ color: white; }

一切正常。但是，当我查看由我的团队其他成员创建的样式表时，他们会将样式标记包含在内容中。所以它让我觉得CSS文件真的应该是这样的：

<style type="text/css"> 
body{ background-color: gray;} 
p { color: blue; } 
h3{ color: white; }


</style>

但是，当我将样式标签放入禁用CSS时。我做错了什么？

感谢您的帮助。

Ellliott

Answer 1

<style> HTML标记适用于CSS HTML文件中的内容。

如果是外部CSS文件，则不要使用它们，因为它不是HTML文件。

Answer 2

<style>标记是HTML tag，您可以使用它直接在页面中包含CSS。外部CSS文件应该只包含CSS声明，而不是用HTML包装。

例如（带上你的HTML）：

<html>
<head>
<style type="text/css"> <!-- style is an HTML element -->
    body { background-color: gray; }
</style>
</head>
<body>
   <h3> A White Header </h3>
     <p> This paragraph has a blue font.  
      The background color of this page is gray because
   we changed it with CSS! </p>
  <INPUT TYPE=text NAME="userID" id="userID" Size=20 > 
</body>

根据HTML规范，您的方法最好：

要指定多个元素的样式信息，作者应该使用STYLE元素。为获得最佳灵活性，作者应该定义外部样式表中的样式。

需要外部CSS参考的帮助

2 个答案: