在網頁設計中，CSS是必不可少的一種技術，它可以很方便地控制網頁的樣式和布局。其中一個非常重要的技巧就是CSS的顯示隱藏動效。在本文中，我們將介紹如何使用CSS實現顯示隱藏動效。

首先，為了實現顯示隱藏效果，我們需要使用CSS中的display屬性。該屬性可以控制元素在網頁中的顯示方式，包括block、inline和none等選項。其中，none表示隱藏該元素，而block和inline分別表示塊元素和行內元素。

.hidden {
display: none;
}
.show {
display: block;
}

接下來，我們需要添上一些CSS樣式，使得顯示隱藏動效更加美觀。我們可以使用CSS中的transition屬性來控制動畫效果，例如增加動畫持續時間、增加延遲等。

.hidden {
display: none;
transition: all 0.5s ease-in-out;
}
.show {
display: block;
transition: all 0.5s ease-in-out;
opacity: 1;
}

最后，我們需要使用JavaScript來實現觸發顯示隱藏動效的操作。在本例中，我們使用jQuery簡化代碼。

$('button').click(function(){
$('.hidden').toggleClass('show');
});

通過以上三步的操作，我們就可以實現CSS顯示隱藏動效，這可以使網頁更加生動有趣。如果你熟悉CSS和JavaScript，可以自己動手嘗試，否則可以參考以上代碼進行實現。