網頁中，CSS樣式往往是調整頁面布局的關鍵。其中，高度屬性常常被用來指定元素的高度大小，但有時候，我們會發現高度屬性并沒有起到作用，這就是CSS高度失效的問題。

.box {
width: 200px;
height: 100px!important;
}

CSS高度失效的主要原因是樣式優先級的問題，具體來說，就是其他樣式已經覆蓋了高度屬性。

例如，在上面的代碼中，我們為.box元素設置了寬度和高度。但是，如果頁面中存在其他樣式將高度屬性覆蓋掉，那么原本的高度屬性就失去了作用。

.example {
height: 150px;
}

如上代碼中的.example，它的樣式會覆蓋.box中的高度屬性，因為.example的優先級比.box高。為了解決這個問題，我們可以采用一些方法來提升高度屬性的優先級，例如：

.box {
width: 200px;
height: 100px!important;
}
.example {
height: 150px!important;
}

我們在高度屬性后加上!important關鍵字，這樣可以強制樣式表遵循這個樣式定義。這樣，我們就可以成功地令元素的高度屬性生效了。當然，這種方法也有它的局限性，必須慎重使用。

CSS高度失效的問題需要我們了解并掌握如何解決，一旦解決了CSS高度失效的問題，我們就能夠更好地進行頁面布局的設計了。