html5静态网页制作代码
HTML5静态网页制作通常指的是创建一个不需要后端数据库或动态脚本支持的网页。以下是一个简单的HTML5静态网页示例代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>我的静态网页</title>
<style>
body {
font-family: Arial, sans-serif;
}
header, nav, section, footer {
margin: 10px 0;
padding: 15px;
border: 1px solid #ddd;
}
</style>
</head>
<body>
<header>
<h1>欢迎来到我的网页</h1>
</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>
<section>
<h2>最新文章</h2>
<p>这是一个静态网页,所以不包含最新文章。</p>
</section>
<footer>
<p>版权所有 © 2023</p>
</footer>
</body>
</html>
这个示例包含了HTML5的文档类型声明,使用<header>
, <nav>
, <section>
, <footer>
等HTML5语义元素来构建网页结构,并通过内部样式表(style标签)添加了简单的CSS样式。这个网页没有后端逻辑,不会与数据库交互,是纯静态内容的展示。
评论已关闭