CSS框架是前端開發中經常使用的工具。它們提供的基礎樣式和布局可以幫助開發者快速地構建網站。在一個CSS框架中，通常會包含以下四種結構。

1. 基礎樣式

框架的基礎樣式指的是文本、表格、按鈕等基礎元素的樣式。這些樣式是網站中經常使用的，通過框架提供的樣式，可以減少開發者的工作量和時間。

.btn {
display: inline-block;
padding: 6px 12px;
margin-bottom: 0;
font-size: 14px;
font-weight: 400;
line-height: 1.42857143;
text-align: center;
white-space: nowrap;
vertical-align: middle;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
border-radius: 4px;
}

2. 布局

網站的布局是非常重要的，因為良好的布局可以提高用戶的體驗。CSS框架提供的布局可以幫助開發者快速地構建網頁的結構，比如柵格布局、居中對齊等。

.container {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
.row {
margin-right: -15px;
margin-left: -15px;
display: flex;
flex-wrap: wrap;
}
.col-md-6 {
flex-basis: 50%;
max-width: 50%;
display: block;
}

3. 組件

組件是指在網頁中經常出現的一些模塊，比如導航欄、輪播圖、模態框等。CSS框架提供的組件通常包含HTML、CSS和JavaScript代碼，可以幫助開發者快速地構建這些常見的組件。

<div class="modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Modal title</h5>
<button type="button" class="close" data-dismiss="modal">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>Modal body text goes here.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>

4. 工具類

工具類是指一些簡單的CSS類，可以實現一些常見的效果，比如清除浮動、隱藏元素等。

.clearfix::after {
content: "";
display: table;
clear: both;
}
.hidden {
display: none !important;
}

這四種結構組成了一個完整的CSS框架。在實際開發中，可以根據自己的需求選擇相應的框架，來提高效率和減少錯誤。