HTML5和CSS3是現代網頁開發的重要技術。其中，HTML5主要負責網頁的結構，而CSS3則負責網頁的樣式。在下面的例子中，我們將展示使用HTML5和CSS3制作網頁的源代碼。我們將利用HTML5的語義化標簽和CSS3的新特性來創建一個簡單的網頁。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>我的網頁</title>
<style>
body {
background-color: #EEEEEE;
font-family: 'Helvetica Neue', sans-serif;
font-size: 16px;
color: #333333;
margin: 0;
padding: 0;
}
header {
background-color: #11AABB;
color: #FFFFFF;
padding: 20px;
text-align: center;
}
nav {
background-color: #FFFFFF;
border: 1px solid #CCCCCC;
padding: 20px;
}
nav ul {
list-style: none;
margin: 0;
padding: 0;
}
nav ul li {
display: inline-block;
}
nav ul li a {
display: block;
padding: 10px;
color: #333333;
text-decoration: none;
}
section {
margin: 20px;
padding: 20px;
background-color: #FFFFFF;
border: 1px solid #CCCCCC;
}
footer {
background-color: #11AABB;
color: #FFFFFF;
padding: 20px;
text-align: center;
}
</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>這是一個使用HTML5和CSS3制作的簡單網頁。</p>
</section>
<footer>
<p>版權所有 ? 2022 我的網頁</p>
</footer>
</body>
</html>在上面的源代碼中，我們首先定義了HTML5文檔的類型。然后，在<head>中設置了文檔的編碼和標題。接下來，我們使用CSS3來定義了網頁的外觀和樣式。我們使用header、nav、section和footer等語義化標簽來創建結構，并使用CSS3來設置它們的樣式。我們還在<nav>中創建了一個導航菜單。最后，在<footer>中添加了版權信息。