CSS3是前端開發中的一個重要技術之一，它可以使網頁的外觀更加豐富多彩。CSS3提供了許多動畫效果，可以用于各種場景，如頁面載入時的進度條動畫、導航欄hover效果等等。

.progress-bar {
width: 0;
height: 10px;
background-color: #ccc;
transition: width 0.3s ease-in-out;
}
.loading {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.loading .progress-bar {
width: 50%;
border-radius: 5px;
background-color: #0077ff;
}

上面的代碼展示了一個簡單的進度條動畫效果，當頁面加載時，進度條從0%到100%變化。其中，transition屬性定義了動畫過渡效果的時間和緩動函數。

.nav-link:hover .sub-menu {
opacity: 1;
}
.sub-menu {
opacity: 0;
transition: opacity 0.3s ease-in-out;
position: absolute;
top: 50px;
left: 0;
z-index: 1;
}

此外，CSS3還提供了許多可以隱藏或顯示元素的屬性和動畫效果。

.toggle {
display: none;
}
.expand {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease-in-out;
}
.toggle:checked ~ .expand {
max-height: 1000px;
}

上面的代碼演示了一個可以展開或收起內容的效果，當點擊開關按鈕時，展開內容的高度從0變為自適應高度。

總之，CSS3提供了許多強大的動畫和隱藏效果，可以讓我們的網頁更加生動有趣。