明星資料卡是一個很常見的網站組件，它通常用于介紹明星的基本信息。在本文中，我們將學習如何使用CSS來設計一個漂亮的明星資料卡。

.star-card {
width: 300px;
height: 400px;
background-color: #fff;
border-radius: 10px;
box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
overflow: hidden;
}
.star-card img {
width: 100%;
height: 60%;
object-fit: cover;
}
.star-card h2 {
margin: 10px;
font-size: 24px;
font-weight: bold;
}
.star-card p {
margin: 10px;
font-size: 16px;
color: #666;
}
.star-card .labels {
display: flex;
margin: 10px;
justify-content: space-between;
}
.star-card .labels span {
font-size: 14px;
color: #999;
}
.star-card .labels span:first-child {
margin-right: 10px;
}
.star-card .btn {
display: block;
margin: 10px;
padding: 10px 20px;
font-size: 18px;
color: #fff;
background-color: #3498db;
border: none;
border-radius: 5px;
cursor: pointer;
transition: 0.3s;
}
.star-card .btn:hover {
background-color: #2980b9;
}

以上就是一個基本的明星資料卡的CSS樣式代碼，我們可以通過調整這些樣式來實現不同的設計效果。當然，如何將這些樣式應用到HTML代碼中需要結合具體的實現情況來決定。