CSS標準流布局是一種常見的網頁布局方式。它是指在網頁上所有元素按照其在HTML文件中出現的順序，依次從上到下、從左到右排列的布局方式。
在CSS標準流布局中，每一個塊級元素都默認占據一行，而每一個內聯元素則會相鄰放置。如果一個塊級元素沒有設置寬度，它會自動占據整個父元素的寬度，并且高度會根據其內部內容的高度自動調整。
下面是一個基本的CSS標準流布局的例子：
<!DOCTYPE html>
<html>
<head>
<style>
#header {
background-color: blue;
color: white;
}
#sidebar {
background-color: gray;
color: white;
float: left;
width: 20%;
}
#content {
background-color: white;
color: black;
float: left;
width: 80%;
}
#footer {
background-color: blue;
color: white;
clear: both;
}
</style>
</head>
<body>
<div id="header">
<h1>This is the header</h1>
</div>
<div id="sidebar">
<p>This is the sidebar</p>
</div>
<div id="content">
<p>This is the content area</p>
</div>
<div id="footer">
<p>This is the footer</p>
</div>
</body>
</html>在這個例子中，我們使用了四個div元素來實現一個簡單的布局。其中，#header元素占據了一整行，#sidebar和#content元素則占據了同一行，#footer元素則又占據了一整行。
通過設置#sidebar和#content元素的寬度為20%和80%，我們讓它們占據了整個頁面寬度。同時，我們還通過設置#sidebar元素的float屬性實現了左浮動，讓#sidebar和#content緊貼在一起。
需要注意的是，在這個例子中，我們為#footer元素設置了clear屬性，以避免float元素的影響。如果我們沒有設置clear屬性，#footer元素將會出現在#content元素的旁邊，而不是出現在行的末尾。
總之，CSS標準流布局是一種常見的網頁布局方式，它可以幫助我們簡單而有效地創建各種網頁布局。