當我們在網頁中添加一些需要折疊或者展開的內容時，點擊顯示內容的 css 樣式就非常適用了。為了讓大家更好地理解這個樣式的實現方法，下面我們就簡單介紹一下它的使用。

首先，在 HTML 中，我們需要定義一個外框來包裹我們需要顯示或者隱藏的內容（通常是一個 div 標簽），同時給它一個類名（例如 "content"）。然后，我們在 CSS 中定義好這個外框的一些基本樣式。

.content {
border: 1px solid #ccc;
background-color: #f5f5f5;
padding: 10px;
margin-bottom: 10px;
overflow: hidden;
}

接著，在我們需要點擊來進行內容展開或者折疊的元素中（比如一個按鈕），我們可以設置一個點擊事件，來觸發我們定義好的 CSS transition，讓被包裹的內容顯示或者隱藏。

點擊展開/折疊.content.show {
max-height: 200px;
transition: max-height 0.5s ease-out;
}

在這里，我們使用了一個 class 名為 "show" 來定義內容的展開狀態，同時在 JS 中，我們通過 DOM 獲取到了這個內容元素，并在點擊按鈕時切換了這個類名。在 CSS 中，我們給這個類定義了一些屬性，比如最大高度，以及 transition 屬性，來實現內容展開的動畫效果。

這樣，當我們點擊按鈕時，我們定義好的內容就會展示出來，再次點擊時就會折疊回去，非常方便易用。