静态HTML官网页面代码
时间: 2024-02-18 18:13:39 浏览: 66
以下是一个简单的静态 HTML 官网页面的代码示例:
```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" 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>
<h1>欢迎来到我的官网!</h1>
<p>这里是一个静态 HTML 官网页面的示例。</p>
</main>
<footer>
<p>© 2021 我的官网</p>
</footer>
</body>
</html>
```
在上面的代码中,我们定义了一个 HTML5 文档,并在 head 部分设置了网站的标题、字符编码、视口标签和样式表的链接。在 body 部分,我们使用 header 元素来定义网站的页眉,nav 元素来定义导航条,main 元素来定义网站的主要内容,footer 元素来定义网站的页脚。
相关推荐
![](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)
![](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)