HTML 分圖層是網頁開發中非常常見的一種技術，它可以讓開發者將網頁分成不同的層次，從而更好地進行布局和展示。下面是一個簡單的 HTML 分圖層的代碼示例：
<html>
<head>
<title>HTML 分圖層示例</title>
<style>
#header {
background-color: #ccc;
height: 100px;
}
#content {
width: 800px;
margin: 0 auto;
}
#sidebar {
background-color: #eee;
width: 200px;
float: left;
margin-right: 20px;
}
#main {
background-color: #fff;
width: 580px;
float: left;
}
#footer {
background-color: #ccc;
height: 50px;
}
</style>
</head>
<body>
<div id="header">
<p>這是頭部內容</p>
</div>
<div id="content">
<div id="sidebar">
<p>這是側邊欄內容</p>
</div>
<div id="main">
<p>這是主要內容</p>
</div>
</div>
<div id="footer">
<p>這是底部內容</p>
</div>
</body>
</html>在上面的代碼中，可以看到HTML頁面被分成五個部分：頭部（header）、側邊欄（sidebar）、主要內容（main）、底部（footer）和內容區（content）。通過使用CSS分別對這些部分進行樣式定義，實現了非常簡單的布局。
值得注意的是，這個例子使用了float屬性將側邊欄和主要內容分別浮動到左側和右側。為了讓它們正確地對齊，還需要使用margin屬性對兩個div進行間隔調整。
這只是一個簡單的HTML分圖層的例子。在實際開發中，根據具體的業務需求，開發者可以通過定義多個層次，實現更加靈活復雜的頁面布局。上一篇html 包含頁面代碼
下一篇html 分割線設置樣式