CSS问题与背景颜色,在线教程



我正在遵循 css 的在线教程,并以讲师的身份编写了确切的代码,但我无法生成所需的输出。我希望标题"我的网站"具有珊瑚背景,同时生成的输出将珊瑚背景应用于整个页面。

body{
	background-color:#f4f4f4;
	color:#555;
	font-family:sans-serif;
	font-size:16px;
	line-height:1.6em;
	margin:0;
}

.container{
	width:80%;
	margin:auto;
	overflow:hidden;
}

#main-header{
	background-color:coral;
	color:#fff;
}
<!DOCTYPE html>
<html>
<head>
	<title>My Website</title>
	<link rel="stylesheet" type="text/css" href="style1.css">
</head>
<body>
	<header id="main-header">
		<div class="container">
			<h1>My Website</h1>
		</div>
</body>
</html>

我希望标题"我的网站"具有珊瑚背景,同时生成的输出将珊瑚背景应用于整个页面。

在我的浏览器中,您的代码甚至按原样工作,就像您期望的那样工作。但无论如何,还缺少一件事。您的header没有结束标记。

body{
background-color:#f4f4f4;
color:#555;
font-family:sans-serif;
font-size:16px;
line-height:1.6em;
margin:0;
}
.container{
width:80%;
margin:auto;
overflow:hidden;
}
#main-header{
background-color:coral;
color:#fff;
}
<!DOCTYPE html>
<html>
<head>
<title>My Website</title>
<link rel="stylesheet" type="text/css" href="style1.css">
</head>
<body>
<header id="main-header">
<div class="container">
<h1>My Website</h1>
</div>
</header>
</body>
</html>

你的问题对我来说有点不清楚。你说的标题是什么意思?您是主 h1 标签还是标题标签。如果您的答案是 h1,那么我只是给出了一个解决方案,但如果它是标头,那么我认为您的代码正在代码片段中生成正确的输出。

body{
	background-color:#f4f4f4;
	color:#555;
	font-family:sans-serif;
	font-size:16px;
	line-height:1.6em;
	margin:0;
}

.container{
	width:80%;
	margin:auto;
	overflow:hidden;
}

#main-header h1{
	color:coral;
}
<!DOCTYPE html>
<html>
<head>
	<title>My Website</title>
	<link rel="stylesheet" type="text/css" href="style1.css">
</head>
<body>
	<header id="main-header">
		<div class="container">
			<h1>My Website</h1>
		</div>
</body>
</html>

最新更新