CSS3 教學課件

CSS3 是 CSS 的升級版，它引入了許多新的特性和功能，比如圓角，陰影，過渡，動畫等。在 Web 設計中，CSS3 使頁面更加美觀和交互性更強。

下面是一份 CSS3 教學課件，介紹了 CSS3 的主要特性和用法。

1. 圓角

CSS3 引入了圓角的屬性，可以通過設置邊框半徑來實現。

border-radius: 5px;

2. 陰影

陰影是 CSS3 中一個非常實用的特性，可以通過設置陰影的顏色、大小、偏移量來實現。

box-shadow: 0 0 5px #999;

3. 過渡

過渡是指在屬性發生變化時，將屬性從一種狀態平滑地過度到另一種狀態的效果。可以設置過渡的時間和延遲時間。

transition: background-color 0.5s ease-in-out;

4. 動畫

動畫可以通過設置關鍵幀和動畫屬性來實現?？梢栽O置動畫的時間、延遲時間、重復次數等。

@keyframes example {
0%   {background-color: red;}
50%  {background-color: yellow;}
100% {background-color: green;}
}
animation: example 5s infinite;

以上是 CSS3 的一些重要特性和用法，在 Web 設計中能夠大大提高頁面的美觀性和交互性。