在Web前端開發中，CSS是非常重要的一部分，它能夠幫助我們實現網頁界面的美觀和交互。CSS不僅可以美化網頁，還可以通過一些特效使界面更加生動。其中，動畫效果是非常常見的一種特效，比如CSS如何顯示div時的動畫效果。

要讓div顯示時有動畫效果，我們需要使用CSS中的動畫屬性。首先，我們來看一下具體的代碼實現：

<style>
.show-div {
opacity: 0;
transition: opacity 1s ease;
}
.show-div.active {
opacity: 1;
}
</style>
<div class="show-div">
<p>這里是需要顯示的內容。</p>
</div>
<script>
var showDiv = document.querySelector(".show-div");
setTimeout(function() {
showDiv.classList.add("active");
}, 1000);
</script>

在上面的代碼中，我們首先定義了一個show-div類，它設置了初始的opacity值為0，并通過transition屬性設置了過渡效果。當這個類被添加了active類時，它的opacity值變成了1，div就會顯示出來。

在代碼中還有一段JavaScript代碼，它利用setTimeout函數在1秒后給showDiv元素添加了active類，從而觸發了CSS的動畫效果。

總結一下，要使用CSS顯示div時的動畫效果，我們需要先定義一個帶有過渡效果的CSS類，然后利用JS設置一個定時器來觸發添加CSS類的操作，從而完成顯示效果的漸變過程。