CSS是網(wǎng)頁開發(fā)中重要的一環(huán)，它可以控制網(wǎng)頁的樣式和布局。其中，通過將某個(gè)元素的display屬性設(shè)置為none，實(shí)現(xiàn)默認(rèn)隱藏，通過點(diǎn)擊事件或者其他操作，使元素顯示出來的效果是很常見的操作。下面是實(shí)現(xiàn)這種顯示效果的CSS代碼：
/* 隱藏元素 */
.hidden {
display: none;
}
/* 顯示元素 */
.show {
display: block;
}通過為元素的class屬性設(shè)置hidden或者show，即可控制元素的顯示和隱藏。接下來是一個(gè)實(shí)例，點(diǎn)擊按鈕可以展示隱藏的圖片：
<html>
<head>
<title>點(diǎn)擊展示圖片</title>
<style>
.hidden {
display: none;
}
.show {
display: block;
}
</style>
</head>
<body>
<img class="hidden" src="https://picsum.photos/200/300" />
<button onclick="showImage()">點(diǎn)擊展示圖片</button>
<script>
function showImage() {
document.querySelector('img').classList.add('show');
}
</script>
</body>
</html>在這個(gè)例子中，我們首先將圖片的類名設(shè)置為hidden，即隱藏狀態(tài)。在點(diǎn)擊按鈕時(shí)，調(diào)用showImage函數(shù)，將圖片的類名改為show，即顯示狀態(tài)，從而實(shí)現(xiàn)了點(diǎn)擊展示圖片的效果。