在前端開發中，CSS的布局和樣式是非常重要的，其中div標簽及其樣式往往被用于構建網頁組件，如名片。

名片常用的樣式有以下幾點：

.card{
width: 300px;
height: 150px;
background-color: #fff;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
border-radius: 5px;
padding: 20px;
margin: 20px;
}
.card h1{
font-size: 20px;
font-weight: bold;
margin-bottom: 10px;
}
.card p{
font-size: 16px;
line-height: 1.5em;
}

以上樣式定義了一個名片的基本屬性，如寬度、高度、背景、陰影、圓角等。名片中的內容分為標題和文本兩部分，分別定義了標題和文本的樣式。

在HTML中，名片可以用以下代碼創建：

<div class="card">
<h1>姓名</h1>
<p>職業：前端開發</p>
<p>介紹：我是一名熱愛前端的開發者，喜歡用代碼創造美好的事物。</p>
</div>

通過上述代碼，我們可以很方便地創建一個簡約美觀的名片組件，并自由地修改樣式和內容。在實際項目中，名片可以用于展示個人或企業的信息，如聯系方式、簡介等。