Angular2是一款目前非常流行的JavaScript框架，它的特點是基于組件化開發，讓開發者可以更結構化、清晰的開發復雜的Web應用。CSS則是前端開發中不可或缺的一部分，它負責頁面的樣式布局，讓用戶能夠愉悅地瀏覽網站。而在CSS中，var可以讓我們更加方便地管理樣式的變量。

:root {
--primary-color: #337ab7;
--background-color: #f5f5f5;
}
header {
background-color: var(--primary-color);
color: #fff;
padding: 20px;
}
section {
background-color: var(--background-color);
padding: 20px;
}

在以上代碼中，我們定義了兩個變量：--primary-color和--background-color，它們分別代表網站的主要顏色和背景顏色。通過在:root中定義這些變量，我們可以在整個頁面中進行訪問。在示例代碼中，我們在header和section中使用了var()函數來引用這些變量，它們的值會被替換為我們在:root中定義的值。

通過使用var()函數，我們可以更加方便地管理樣式的變量。變量的值只需要在:root中定義一次，就可以在整個頁面中重復使用，避免了我們手動修改每一個相關的樣式的麻煩。