CSS表達式是在CSS中使用JavaScript代碼的一種方式。

在某些情況下，你可能需要在CSS樣式中使用JavaScript代碼，例如動態計算樣式或者根據頁面的狀態來改變樣式。這時候，CSS表達式就派上用場了。

.box {
width: expression(document.documentElement.offsetWidth > 1024 ? "1024px" : "auto");
height: expression(document.documentElement.scrollTop > 300 ? "400px" : "auto");
}

這段代碼可以根據文檔的寬度或者滾動條的位置來設置元素的寬度和高度。但是，這樣的寫法會導致網頁加載緩慢，因為每次重新計算樣式時都會執行一次JavaScript代碼，如果網頁中有很多這樣的表達式，就會導致網頁性能下降。

另外一個問題是，某些瀏覽器不支持CSS表達式或者將其禁用，這樣一來，就會導致樣式無法生效。

為了避免這個問題，我們可以使用CSS3中的新特性來改寫這段代碼：

.box {
width: min(1024px, 100%);
height: clamp(0px, 400px, calc(100vh - 300px));
}

使用這種方式，不僅避免了使用CSS表達式帶來的性能問題，同時可以保證在現代瀏覽器中正常工作。

總之，雖然CSS表達式在某些情況下非常有用，但是我們應該盡可能避免使用它，以免影響網頁性能和可維護性。