CSS布局是網頁設計中非常重要的一部分，它為網站制定了頁面結構和外觀設計。在CSS布局中，有許多常用的樣式圖可供使用，下面介紹一些常用的樣式圖。

/* 清除浮動 */
.clearfix::after{
content: ''; 
display: table;
clear: both;
}
/* 水平居中 */
.center{
margin: 0 auto; 
}
/* 垂直居中 */
.vertical-center{
position: absolute;
top: 50%; 
transform: translateY(-50%);
}
/* 等分布局 */
.row{
display: flex; 
}
.col{
flex: 1; 
}
/* 柵格布局 */
.row{
display: flex;
flex-wrap: wrap; 
}
.col{
flex: 1 0 25%;
}
@media(max-width: 768px){
.col{
flex: 1 0 50%; 
}
}

以上是一些比較常用的CSS樣式，例如清除浮動，水平居中，垂直居中，等分布局和柵格布局等等。這些CSS樣式的出現，使得我們的頁面可以做到更美觀和合理的布局。所以在設計網站時，盡量使用這些常用的樣式，可以更高效、更方便地完成網站的外觀布局。