CSS div卡片樣式非常常用，特別是在網頁設計中，它可以使不同的卡片區域分類并突出展示。下面我們來學習一下如何使用CSS div卡片樣式。

首先我們需要定義一個外部的div，它包裹著我們需要樣式的卡片元素。為了方便，我們給這個外部div定義一個類名，例如“card-container”：

.card-container {
display: flex; /*將卡片排列成一排*/
justify-content: space-between; /*讓卡片之間保持等距離*/
}

接下來，我們需要定義卡片本身的樣式。同樣，我們也需要為它定義一個類名，例如“card”：

.card {
background-color: #fff;
border-radius: 10px;
box-shadow: 0 3px 6px rgba(0,0,0,0.16);
padding: 20px;
width: 300px;
}

在這里，我們定義了卡片的背景顏色、圓角、陰影、內邊距和寬度等樣式。

最后，我們只需要把卡片元素放到外部div容器中即可：

<div class="card-container">
<div class="card">
<h2>這是一張卡片</h2>
<p>這是卡片的內容。</p>
</div>
<div class="card">
<h2>這是另一張卡片</h2>
<p>這是另一張卡片的內容。</p>
</div>
</div>

至此，我們就完成了CSS div卡片樣式的定義。可以看到，非常簡單易懂且容易修改，是一種非常實用的網頁設計技巧。