第1关:背景颜色
任务描述
本关任务:在本关中,我们将学习如何使用CSS
去更改HTML
元素的背景属性。
本关任务完成之后的效果图如下:
相关知识
为了完成本关任务,请大家认真阅读以下内容。
背景色
我们可以使用background-color
为元素设置背景色,通常属性值为颜色名称或颜色编码。
因为HTML
文档中body
元素包含了HTML
文档的所有内容,所以如果要改变整个页面的背景颜色,只需要设置body
元素的background-color
属性。
例如:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello World</title>
<style type="text/css">
body {
background-color: lightyellow;
}
h1 {
color: gray;
background-color: palegreen;
}
p {
background-color: lightgray;
}
</style>
</head>
<body>
<div>
<h1>CSS让网页样式更丰富</h1>
<p>这是一个段落</p>
</div>
</body>
</html>
显示效果如图:
编程要求
学会了基本设置背景颜色的方式,现在让我们来