写一个html网页模板
时间: 2023-12-13 21:03:05 浏览: 36
下面是一个简单的 HTML 模板,你可以在其中添加你的内容:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>My Website</title>
</head>
<body>
<header>
<h1>Welcome to My Website</h1>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</header>
<main>
<section>
<h2>About Me</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed malesuada ligula non velit blandit, vitae dictum enim convallis. Proin ac diam et ante varius dapibus. Nullam nec mauris nunc. Fusce vitae urna vel mi facilisis tempor. Duis quis est a sapien pulvinar egestas. Vivamus sed ligula in ex molestie suscipit. Aliquam erat volutpat. Morbi in justo id nulla consequat ultrices.</p>
</section>
<section>
<h2>My Projects</h2>
<ul>
<li><a href="#">Project 1</a></li>
<li><a href="#">Project 2</a></li>
<li><a href="#">Project 3</a></li>
</ul>
</section>
<section>
<h2>Contact Me</h2>
<form>
<label for="name">Name:</label>
<input type="text" id="name" name="name"><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email"><br>
<label for="message">Message:</label>
<textarea id="message" name="message"></textarea><br>
<button type="submit">Send</button>
</form>
</section>
</main>
<footer>
<p>© 2021 My Website</p>
</footer>
</body>
</html>
```
在这个模板中,你可以看到以下标签和元素:
- `<!DOCTYPE html>`:文件类型声明,告诉浏览器这是一个 HTML 文件。
- `<html lang="en">`:HTML 根元素,并指定语言为英语。
- `<head>`:文档头部,包含了关于文档的元信息(如标题、作者等)和引用的外部资源(如 CSS、JS)。
- `<meta>`:元信息标签,可以设置页面字符集、关键词、描述等信息。
- `<title>`:页面标题,显示在浏览器标签页上。
- `<body>`:文档主体,包含了页面的内容。
- `<header>`:网页的头部,通常包含网站的名称、导航菜单等。
- `<nav>`:网页的导航菜单。
- `<ul>`:无序列表。
- `<li>`:列表项。
- `<a>`:超链接,可以跳转到其他页面或锚点位置。
- `<main>`:网页的主要内容区域。
- `<section>`:网页的一个部分,通常包含一个标题和相关的内容。
- `<h1>` - `<h6>`:标题标签,分别表示六个不同级别的标题。
- `<p>`:段落标签,用于显示普通文本。
- `<form>`:表单标签,用于收集用户输入。
- `<label>`:表单标签,用于描述表单控件的作用。
- `<input>`:表单控件,可以输入文本、选择选项等。
- `<textarea>`:文本区域控件,可以输入多行文本。
- `<button>`:按钮控件,用于提交表单或执行其他操作。
- `<footer>`:网页的底部,通常包含版权信息、联系方式等。
这只是一个简单的模板,你可以根据自己的需要添加或修改其中的内容。