CSS3聯系人

CSS3是一種用于網頁設計的標準，它可以美化網頁的外觀，其中之一就是CSS3聯系人的設計。CSS3聯系人可以讓網頁的聯系人信息更加美觀和易于閱讀，而且可以大大提高網頁的交互性和用戶體驗感。

/* CSS3聯系人樣式 */
.contact-containers {
width: 400px;
margin: 0 auto;
text-align: center;
}
.contact-info {
display: grid;
grid-template-columns: 1fr 2fr;
grid-gap: 10px;
margin: 20px;
border: 1px solid black;
padding: 10px;
border-radius: 10px;
box-shadow: 5px 5px 5px grey;
}
.contact-info p {
margin: 0;
padding: 5px;
font-weight: bold;
}
.contact-info span {
font-weight: normal;
}
.contact-info img {
width: 100%;
max-width: 200px;
margin: auto;
display: block;
}
.contact-info:hover {
box-shadow: 10px 10px 10px lightgrey;
}

以上就是CSS3聯系人的樣式展示，其中包括了容器、聯系人信息、姓名、電話等等信息的樣式，同時也包括了懸停樣式。當鼠標懸停在聯系人信息上時，就會出現一個水平和垂直距離為10px的光影效果。

CSS3聯系人可以應用于企業網站、個人網站、博客等等任何類型的網站設計上。如果你想要讓你的網站更加美觀和易于閱讀，就試試CSS3聯系人的設計吧！