html5框架代码

<!DOCTYPE html>
<html>
<head>
<title>HTML5框架</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>
<section>
<h1>欢迎来到我们的网站</h1>
<p>我们是一家专业的公司,致力于为客户提供最服务。</p>
<button>了解更多</button>
</section>
<section>
<h2>我们的产品</h2>
<ul>
<li>
<img src="product1.jpg" alt="产品1">
<h3>产品1</h3>
<p>这是我们的产品1,非常好用。</p>
</li>
<li>
<img src="product2.jpg" alt="产品2">
<h3>产品2</h3>
<p>这是我们的产品2,非常好用。</p>
</li>
<li>
<img src="product3.jpg" alt="产品3">
<h3>产品3</h3>
<p>这是我们的产品3,非常好用。</p>
</li>
</ul>
</section>
<section>
<h2>我们的团队</h2>
<ul>
<li>
<img src="team1.jpg" alt="团队成员1">
<h3>团队成员1</h3>
<p>这是我们的团队成员1,非常优秀。</p>
</li>
<li>
<img src="team2.jpg" alt="团队成员2">
<h3>团队成员2</h3>
<p>这是我们的团队成员2,非常优秀。</p>
</li>
<li>
<img src="team3.jpg" alt="团队成员3">
<h3>团队成员3</h3>
<p>这是我们的团队成员3,非常优秀。</p>
</li>
</ul>
</section>
</main>
<footer>
<p>版权所有 © 2021</p>
</footer>
</body>
</html>

这是一个基本的HTML5框架代码,包括了头部、导航、主体、页脚等基本结构。其中,头部包括了网页标题、字符集和视口设置等元数据,以及引入了一个样式表文件。导航部分使用了HTML5新增的语义化标签nav和ul/li,实现了一个简单的导航菜单。主体部分使用了HTML5新增的语义化标签section、h1/h2/h3、p、ul/li和button等,展示了网站的主要内容,包括欢迎语、产品和团队介绍等。页脚部分使用了HTML5新增的语义化标签footer和p,展示了版权信息。这个框架代码可以作为一个基础模板,根据实际需求进行修改和扩展。