我的家乡大庆html和css代码
时间: 2023-07-28 22:07:49 浏览: 47
以下是一个简单的HTML和CSS代码,用于展示你的家乡大庆的基本信息:
```html
<!DOCTYPE html>
<html>
<head>
<title>我的家乡-大庆</title>
<style type="text/css">
body {
background-color: #f5f5f5;
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
text-align: center;
}
header {
background-color: #333;
color: white;
padding: 10px;
}
h1 {
font-size: 36px;
margin: 20px 0;
}
img {
display: block;
margin: 0 auto;
max-width: 100%;
}
section {
background-color: white;
margin: 20px;
padding: 20px;
}
p {
font-size: 18px;
line-height: 1.5;
margin: 10px 0;
text-align: left;
text-indent: 2em;
}
footer {
background-color: #333;
color: white;
padding: 10px;
}
</style>
</head>
<body>
<header>
<h1>欢迎来到我的家乡-大庆</h1>
</header>
<img src="大庆.jpg" alt="大庆市中心">
<section>
<h2>基本信息</h2>
<p>大庆市位于黑龙江省中部,是中国石油的发源地,也是我国最大的石油工业城市之一。大庆市景区众多,如伊春林海、黑河大峡谷、鹤山国家森林公园等。此外,大庆还是一个多民族聚居的城市,主要有汉、满、蒙古、回等多个民族,各民族在这里和谐共处,形成了独特的多元文化。</p>
</section>
<footer>
<p>© 2021 我的家乡-大庆</p>
</footer>
</body>
</html>
```
你可以将这段代码保存成`.html`文件,并将一张名为`大庆.jpg`的图片放在同一目录下,即可在浏览器中打开查看效果。注意,这里的图片文件名需要和HTML代码中的文件名一致。