在很多網站中，我們經常會看到一些元素初始狀態是隱藏的，只有當某些條件滿足的時候才會顯示出來。這時候，我們可以使用CSS來進行設置。

首先，我們可以使用display:none來將元素隱藏起來。例如，我們想要在初始狀態下隱藏一個div元素，可以這樣設置：

div {
display:none;
}

接著，我們需要在某些條件下將元素顯示出來。這時候，我們可以在樣式表中定義一個新的類，將該類應用于需要顯示的元素上。例如：

.show {
display:block;
}

然后，在JavaScript中，我們可以為某些事件（如點擊按鈕、滾動頁面等）綁定一個函數，在函數中添加或移除.show類，從而達到控制元素顯示和隱藏的效果。例如：

document.getElementById('button').onclick = function() {
var div = document.getElementById('myDiv');
div.classList.toggle('show');
}

在上面的代碼中，我們通過getElementById方法獲取了一個按鈕元素，并將點擊事件綁定到該按鈕上。當按鈕被點擊時，我們獲取了一個需要顯示/隱藏的div元素，并通過toggle方法來切換.show類的應用。

這樣，我們就可以通過CSS設置元素初始狀態為隱藏狀態，并通過JavaScript動態地控制元素的顯示和隱藏了。