用html5 css做一个没事介绍的网页代码
时间: 2024-01-13 14:04:05 浏览: 24
当然可以!以下是一个简单的 HTML5 和 CSS 页面示例,用于介绍一个健身房:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>健身房介绍</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
header {
background-color: #333;
color: #fff;
padding: 10px;
text-align: center;
}
nav {
background-color: #eee;
padding: 10px;
text-align: center;
}
nav a {
color: #333;
text-decoration: none;
padding: 10px;
}
main {
padding: 20px;
}
h1 {
color: #333;
font-size: 36px;
text-align: center;
}
img {
display: block;
margin: 0 auto;
max-width: 100%;
}
p {
font-size: 18px;
line-height: 1.5;
margin-bottom: 20px;
}
footer {
background-color: #333;
color: #fff;
padding: 10px;
text-align: center;
}
</style>
</head>
<body>
<header>
<h1>欢迎来到健身房</h1>
</header>
<nav>
<a href="#">首页</a>
<a href="#">课程介绍</a>
<a href="#">会员服务</a>
<a href="#">关于我们</a>
</nav>
<main>
<img src="gym.jpg" alt="健身房">
<h1>我们的课程</h1>
<p>我们的健身房提供各种类型的健身课程,包括瑜伽、普拉提、有氧运动、力量训练等。</p>
<h1>我们的服务</h1>
<p>我们的健身房提供全方位的会员服务,包括个性化训练计划、营养咨询、健身器材使用指导等。</p>
</main>
<footer>
<p>版权所有 © 2021 健身房</p>
</footer>
</body>
</html>
```
这个页面包括一个简单的导航菜单、一个标题、一张图片和一些文本。CSS 样式定义了页面的外观和布局,其中包括页面的背景颜色、字体、大小、对齐方式等。
你可以将这个示例保存为 `.html` 文件,然后在浏览器中打开它,查看效果。