html 网站首页网页模板
时间: 2023-09-17 15:06:38 浏览: 62
以下是一个简单的 HTML 网站首页网页模板,你可以根据自己的需要进行修改和定制:
```
<!DOCTYPE html>
<html>
<head>
<title>网站首页</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<header>
<nav>
<ul>
<li><a href="#">主页</a></li>
<li><a href="#">关于我们</a></li>
<li><a href="#">服务</a></li>
<li><a href="#">联系我们</a></li>
</ul>
</nav>
</header>
<main>
<section>
<h1>Welcome to Our Website</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed auctor purus non justo feugiat, vel malesuada orci tincidunt. Pellentesque malesuada, felis eget lobortis blandit, nisi felis euismod justo, ut posuere tellus mauris sed enim. Donec tincidunt, libero sit amet blandit consequat, sapien dolor varius quam, sit amet bibendum dui leo a massa. Proin varius, libero id accumsan ullamcorper, nibh tortor dictum dolor, eu commodo elit lacus at nunc. </p>
</section>
<section>
<h2>我们的服务</h2>
<ul>
<li>网站设计</li>
<li>网站开发</li>
<li>搜索引擎优化</li>
<li>社交媒体营销</li>
</ul>
</section>
</main>
<footer>
<p>© 2021 网站名称</p>
</footer>
</body>
</html>
```
你还需要在同一目录下创建一个名为 `style.css` 的 CSS 文件,用来定义网页的样式:
```
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
header {
background-color: #333;
color: #fff;
padding: 20px;
}
nav ul {
list-style: none;
margin: 0;
padding: 0;
display: flex;
justify-content: space-between;
}
nav ul li {
margin: 0 10px;
}
nav ul li a {
color: #fff;
text-decoration: none;
}
main {
padding: 20px;
}
section {
margin-bottom: 20px;
}
h1, h2 {
text-align: center;
}
footer {
background-color: #333;
color: #fff;
text-align: center;
padding: 20px;
}
```
这个模板是一个基础的网站首页模板,你可以根据自己的需要进行修改和定制,加入更多的内容和样式。
相关推荐
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)