在當(dāng)前的網(wǎng)頁開發(fā)中，H5技術(shù)已經(jīng)越來越成為主流，而CSS樣式的美化也是H5技術(shù)不可或缺的一部分。當(dāng)然，美化的同時(shí)，我們也要保證網(wǎng)頁的可讀性和易用性。下面就為大家介紹幾種好看的CSS樣式。

/*居中*/
.center{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
/*漸變背景*/
.gradient-background{
background: linear-gradient(to right, #4077b4 0%, #004c8c 100%);
}
/*實(shí)現(xiàn)圖片覆蓋效果*/
.overlay{
position: relative;
}
.overlay:hover .overlay-mask{
opacity: 1;
}
.overlay-mask{
position: absolute;
background-color: rgba(0, 0, 0, 0.5);
top: 0;
bottom: 0;
left: 0;
right: 0;
opacity: 0;
transition: all ease-out 0.3s;
}
/*鼠標(biāo)經(jīng)過放大縮小*/
.hover-scale{
width: 100px;
height: 100px;
transition: all ease-out 0.3s;
}
.hover-scale:hover{
transform: scale(1.2);
}
/*旋轉(zhuǎn)動(dòng)畫*/
.rotate{
animation: rotate 2s infinite;
}
@keyframes rotate{
from{
transform: rotate(0);
}
to{
transform: rotate(360deg);
}
}

以上幾種CSS樣式，可以在實(shí)際的網(wǎng)頁開發(fā)中靈活運(yùn)用，并根據(jù)需求進(jìn)行變形。希望這些CSS樣式能給大家?guī)硪恍╈`感。