會員卡是現代商業中普遍使用的優惠方式。CSS是前端開發領域廣泛使用的技術，可以幫助網站開發者美化界面，提高用戶體驗。這篇文章將介紹如何使用CSS來制作一個簡單的會員卡。

/* CSS代碼開始 */
/* 設置卡片的樣式 */
.card {
border: 1px solid #ccc; /* 設置邊框樣式 */
width: 300px; /* 設置寬度 */
height: 200px; /* 設置高度 */
display: flex; /* 設置布局方式 */
flex-direction: column; /* 設置主軸方向為垂直 */
justify-content: center; /* 設置垂直居中 */
align-items: center; /* 設置水平居中 */
font-family: Arial, sans-serif; /* 設置字體 */
}
/* 設置卡片頂部標記的樣式 */
.card__mark {
background-color: #ff4d4d; /* 設置背景色 */
color: #fff; /* 設置文字顏色 */
font-size: 1rem; /* 設置字體大小 */
padding: 0.5rem 1rem; /* 設置內邊距 */
border-radius: 0.5rem 0.5rem 0 0; /* 設置圓角邊框 */
position: absolute; /* 相對于父元素定位 */
top: 0; /* 設置與頂部的距離 */
}
/* 設置卡片內容區域的樣式 */
.card__content {
margin-top: 3rem; /* 設置與標題的距離 */
}
/* 設置會員卡號的樣式 */
.card__number {
font-size: 2rem; /* 設置字體大小 */
font-weight: bold; /* 設置字體粗細 */
}
/* 設置優惠信息的樣式 */
.card__discount {
font-size: 1.2rem; /* 設置字體大小 */
}
/* CSS代碼結束 */

以上CSS代碼已經設置好了一個簡單的會員卡的外觀，可以根據實際需求進行修改。最后，我們需要在HTML中添加相應的元素來呈現會員卡：

VIP
123456789
8折優惠

現在，我們已經成功地使用CSS制作了一個簡單的會員卡，并在HTML中呈現出來。通過進一步的樣式調整，我們可以創造出更加豐富、美觀的會員卡。