简单html静态网页代码
当创建一个简单的HTML静态网页时，你可以使用
html<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>简单静态网页</title>
</head>
<body>
<header>
<h1>欢迎来到我的网页</h1>
</header>
<nav>
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">关于我们</a></li>
<li><a href="#">联系我们</a></li>
</ul>
</nav>
<section>
<h2>介绍</h2>
<p>这是一个简单的静态网页的示例。</p>
</section>
<section>
<h2>联系信息</h2>
<p>Email: example@example.com</p>
<p>电话: 123-456-7890</p>
</section>
<footer>
<p>© 2024 简单静态网页</p>
</footer>
</body>
</html>
这个例子中有一个包含标题、导航栏、两个部分，以及页脚的简单页面结构。你可以根据需要添加、删除或修改内容。保存上述代码为.html文件并在浏览器中打开，就可以看到简单的静态网页。
列表：
你可以使用有序列表和无序列表添加项目列表。
html<section>
<h2>服务</h2>
<ul>
<li>Web开发</li>
<li>移动应用开发</li>
<li>设计服务</li>
</ul>
</section>
表格：
使用<table>元素创建表格，<tr>表示行，<td>表示数据单元格。
html<section>
<h2>团队成员</h2>
<table>
<tr>
<th>姓名</th>
<th>职位</th>
</tr>
<tr>
<td>John Doe</td>
<td>开发者</td>
</tr>
<tr>
<td>Jane Smith</td>
<td>设计师</td>
</tr>
</table>
</section>
图片：
使用<img>元素嵌入图片。
html<section>
<h2>我们的办公室</h2>
<img src="office.jpg" alt="办公室照片">
</section>
表单：
使用<form>元素创建表单，包括输入字段、按钮等。
html<section>
<h2>联系我们</h2>
<form action="/submit_form" method="post">
<label for="name">姓名:</label>
<input type="text" id="name" name="name" required>
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
<input type="submit" value="提交">
</form>
</section>
样式：
你可以使用内联样式或链接外部样式表来添加样式。
html<style>
body {
font-family: Arial, sans-serif;
background-color: #f2f2f2;
}
section {
border: 1px solid #ccc;
margin: 10px;
padding: 10px;
}
</style>
或者，你可以将样式放在一个外部的CSS文件中，并在HTML文件中链接它：
html<link rel="stylesheet" type="text/css" href="styles.css">
