我已经在 styles.css 中实现了 CSS 样式，并在 ExternalCSSStyles.html 中使用了该文件。文件内容如下: 样式.css
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
color:fuchsia;
font-family:verdana;
font-size:300%;
}
p {
color:maroon;
font-family:courier;
font-size:160%;
}
</style>
</head>
</html>
ExternalCSSStyles.html 如下:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
显示的输出如下: 这是一个标题(黑色)
这是一个段落。(栗色)
但是如果我修改 ExternalCSSStyles.hmtl 使其成为内部 CSS 样式如下:
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
color:fuchsia;
font-family:verdana;
font-size:300%;
}
p {
color:maroon;
font-family:courier;
font-size:160%;
}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
然后输出如下: 这是一个标题(紫红色)
这是一个段落。(栗色)
我的问题是为什么标题没有按照 styles.css 中提供的样式生效？ 请帮我解决这个问题。
最佳答案
您正在添加 styles.css 但 styles.css 必须不包含任何 html 标签，因此删除所有来自 styles.css 的 html 标签，如
h1 {
color:fuchsia;
font-family:verdana;
font-size:300%;
}
p {
color:maroon;
font-family:courier;
font-size:160%;
}<h1>This is a heading</h1>
<p>This is a paragraph.</p>然后测试你的页面它会正常工作..
关于html - CSS 样式未反射(reflect)在 HTML 中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28337093/