隨著Web頁面的不斷發展，越來越多的功能可以由純div css來實現，比如點擊展開或隱藏內容的效果。

<div class="click-to-expand">
<div class="label">點擊展開</div>
<div class="content">這里是要展開的內容</div>
</div>
<style>
.click-to-expand {
cursor: pointer;
}
.label {
background-color: #ddd;
padding: 10px;
}
.content {
padding: 10px;
display: none;
}
.click-to-expand.active .content {
display: block;
}
</style>

上面的代碼中，我們先定義了一個外層的div元素作為點擊容器，內部包含一個標簽用于點擊后展開內容，以及一個內容區域。

接著，我們使用CSS來實現點擊展開的效果。首先給容器設置cursor:pointer樣式，讓鼠標在上面時變為手型，增加交互美觀度。然后給標簽和內容區域定義樣式，其中標簽的背景色為灰色，內容區域默認是隱藏的。

最后，使用.active類來實現點擊后展開內容的效果。給容器添加.active樣式后，內容區域的display變為block，從而實現了展開的效果。

使用純div css實現點擊展開的效果，可以使頁面更輕量化，更加優雅。通過這種方式實現的效果，也可以避免一些常見的性能瓶頸，比如動態添加或刪除DOM元素時的性能問題。