CSS3是當前Web開發中非常重要的一份子,其中的特效越來越多、越來越強大。以下是一些常見的CSS3特效:
/* 圓角 */ border-radius: 10px; /* 陰影 */ box-shadow: 2px 2px 2px #888; /* 漸變 */ background: linear-gradient(red, orange, yellow, green); /* 動畫 */ @keyframes move { 0% { transform: translateX(0); } 100% { transform: translateX(100px); } } div { animation: move 1s ease infinite; } /* 彈性盒子 */ display: flex; justify-content: center; align-items: center; /* 變形 */ transform: rotate(45deg); /* 濾鏡 */ filter: grayscale(50%); /* 媒體查詢 */ @media only screen and (max-width: 768px) { /* 樣式 */ }
這些特效可以通過各種方式與HTML元素結合,讓網站呈現出更豐富、更生動的效果。同時,CSS3也在不斷更新,未來將有更多的特效出現。