我正在研究这个例子:
<!DOCTYPE html>
<html>
<head>
<title>Introducing to CSS</title>
<link href="css/example.css" type="text/css"
rel="stylesheet" />
</head>
<body>
<h1>From Garden to Plate</h1>
<p> A <i>potager</i> or kitchen garden...</p>
<h2>What to plant</h2>
<p>Plant are chosen as...</p>
</body>
</html>
body {
font-family: Arial, Verdana, sans-serif;}
h1, h2 {
color: #ee3e80;}
p {
color: #665544;}
结果是我无法在我的网页上进行任何更改。 CSS 规则不起作用。我不知道为什么。我的第二个问题是:当我想用CSS修改网页的样式时,是否需要“link”元素?
最佳答案
如果你想让你的 CSS 正常工作,你可以通过两种主要方式来实现:
- 使用
<style>
标签。
您可以将 CSS 代码附在 <style></style>
中在head
里面或 body
像这样:
<style>
body {
font-family: Arial, Verdana, sans-serif;
}
h1, h2 {
color: #ee3e80;
}
p {
color: #665544;
}
</style>
- 使用
<link>
标签。
您的示例中已有这行代码:
<link href="css/example.css" type="text/css" rel="stylesheet" />
假设您有一个包含 example.css 文件的 css 文件夹,您可以将您的样式放在那里,它也能正常工作。
通常使用第二个变体更可取,因为它将您的 CSS 保存在单独的文件中并且您的 HTML 保持干净。
关于css - "link"这个元素在CSS修改网页样式的时候需要吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47293100/