CSS中展开关闭效果是一个十分实用的特性。它可以让页面中的一些内容在用户需要时展开，不需要时收起，以此节省页面空间，提高用户体验。 例如，我们可以使用以下代码实现一个简单的展开关闭效果：

<button id="btn">展开</button>
<p id="content" style="display:none">这是需要展开的内容</p>
<script>
let btn = document.getElementById('btn');
let content = document.getElementById('content');
btn.addEventListener('click', function() {
if (content.style.display === 'none') {
content.style.display = 'block';
btn.innerText = '收起';
} else {
content.style.display = 'none';
btn.innerText = '展开';
}
});
</script>

当点击按钮时，会切换内容的显示状态。如果内容处于隐藏状态（display:none），则将其显示出来（display:block），并将按钮文字改为“收起”。反之，如果内容处于显示状态，则将其隐藏（display:none），并将按钮文字改为“展开”。

除了上述的代码实现方法，CSS中还有一些其他的展开关闭效果方法，比如使用CSS3中的transition或animation属性，以及结合JavaScript使用animate()方法等。不同的方法适用于不同的场景，可以根据具体情况来选择使用哪种方法。