CSS編程中，100%布局是一種常見的網頁布局方式。它被廣泛使用，因為它允許網頁適應橫向和縱向的不同屏幕大小，使網站更容易在不同設備屏幕上使用。

body {
margin: 0;
padding: 0;
height: 100%;
}
.container {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
.header,
.footer {
height: 100px;
background-color: #333;
}
.content {
flex-grow: 1;
background-color: #f5f5f5;
overflow-y: auto;
}

上面的代碼展示了一個基本的100%布局。它包含一個容器元素 .container，其中包含頭部、內容和底部三個部分。.container 的高度設置為100%，以便適應屏幕不同大小。同時，.container 需要做到 flex 布局，以實現所有子元素的豎直方向布局。頭部和底部的高度可以設置為相同的高度，這也是人們較常見的做法，因為這樣網頁看起來更加均衡。

其中，.content 的高度沒有固定值，而是使用 flex-grow: 1 使它自動填充剩余空間。在代碼中，我們也可以看到 overflow-y: auto 的設置，使得當內容超出高度時，用戶可以通過滾動條查看隱藏部分。

總體來說，使用100%布局能夠幫助我們輕松地實現網頁自適應大小，讓用戶更加方便地在不同的設備上使用我們的網站。