html5静态网页制作代码

作者：System 时间：2024年08月16日分类：所有,html5 字数：1078

这篇文章距离上次修改已过190天，其中的内容可能已经有所变动。

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>版权所有 &copy; 2023</p>
    </footer>
</body>
</html>

这个示例包含了HTML5的文档类型声明，使用<header>, <nav>, <section>, <footer>等HTML5语义元素来构建网页结构，并通过内部样式表(style标签)添加了简单的CSS样式。这个网页没有后端逻辑，不会与数据库交互，是纯静态内容的展示。

html5静态网页制作代码

评论已关闭

推荐阅读