CSS是前端開發中不可或缺的一部分，它可以讓我們更方便地實現網頁的布局、樣式和交互效果。而CSS擴展則是CSS的進一步延伸，為我們提供了更多的樣式和交互效果，讓我們的網頁更加炫酷、實用。

/* 以下是一些常見的CSS擴展 */
/* 1. CSS動畫 */
.box {
animation: mymove 5s infinite;
}
@keyframes mymove {
from {left: 0;}
to {left: 200px;}
}
/* 2. CSS變量 */
:root {
--main-color: #ff0000;
--bg-color: #ffffff;
}
body {
background-color: var(--bg-color);
}
h1 {
color: var(--main-color);
}
/* 3. CSS網格布局 */
.container {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: auto;
}
.item {
grid-column-start: 2;
grid-column-end: 4;
}
/* 4. CSS濾鏡 */
.image {
filter: grayscale(100%);
}
/* 5. CSS變換 */
.box {
transform: rotate(45deg);
}

以上只是CSS擴展中的一些常見用法，還有很多其他的擴展用法可以讓我們的網頁效果更加豐富多彩。當然，使用CSS擴展也要注意瀏覽器兼容性，需要及時更新相應的瀏覽器版本或選擇合適的工具。