HTML5 的兩欄布局是網頁設計中非常常用的頁面布局方式，一般采用 CSS 實現。下面是兩欄布局的 HTML 代碼示例：
<!DOCTYPE html>
<html>
<head>
<title>HTML5 兩欄布局代碼示例</title>
<style>
.wrapper {
width: 980px;
margin: 0 auto;
}
.left-column {
width: 680px;
float: left;
}
.right-column {
width: 280px;
float: right;
}
.clear {
clear: both;
}
</style>
</head>
<body>
<div class="wrapper">
<div class="left-column">
<p>左側欄目內容</p>
</div>
<div class="right-column">
<p>右側欄目內容</p>
</div>
<div class="clear"></div>
</div>
</body>
</html>以上代碼中，使用了 div 元素來分別表示左側欄目和右側欄目，分別添加了 .left-column 和 .right-column 的類名，并設置了寬度和浮動屬性。使用了 .wrapper 類來包裹兩個欄目，并設置了寬度和 margin 屬性。還添加了 .clear 類，用于清除浮動影響。
需要注意的是，以上代碼只是最基礎的兩欄布局示例，實際開發中需要根據具體需求進行修改調整。需要根據實際情況對 .wrapper、.left-column、.right-column 和 .clear 類進行調整，以實現更符合要求的布局效果。
在使用 HTML5 兩欄布局時，需要在頭部使用 CSS 樣式表鏈接，將 CSS 樣式代碼放置在樣式表中，便于維護修改。
總之，HTML5 的兩欄布局使用簡單易懂，可實現多種頁面布局需求。需要在實際開發中多加嘗試和練習，掌握更豐富多樣的布局方式。下一篇純css創作憤怒小鳥