CSS3作為前端開發中非常重要的一部分,其強大的效果讓頁面更加美觀、精致。以下是CSS3中常用的效果:
/*圓角*/ border-radius: 5px; /*陰影*/ box-shadow: 5px 5px 5px #888; /*漸變*/ background: -webkit-linear-gradient(red, yellow); /* Safari 5.1 - 6.0 */ background: -o-linear-gradient(red, yellow); /* Opera 11.1 - 12.0 */ background: linear-gradient(red, yellow); /* 標準版本 */ /*旋轉*/ transform: rotate(45deg); /*縮放*/ transform: scale(2); /*過渡*/ transition: width 2s; /*動畫*/ @-webkit-keyframes mymove { from {left: 0px;} to {left: 200px;} } /*3D變換*/ transform: perspective(1000px) rotateX(45deg); /*多重背景*/ background-image: url(bg1.png), url(bg2.png), url(bg3.png);
以上是CSS3中常用的幾種效果,應用它們可以讓網站更具藝術性和科技感。當然,CSS3的效果還有很多,需要我們在實踐中不斷探索。