CSS點(diǎn)擊后隱藏div是網(wǎng)頁設(shè)計(jì)中常用的交互效果，通過運(yùn)用CSS語言中的事件觸發(fā)和選擇器等知識(shí)來實(shí)現(xiàn)。下面介紹一下實(shí)現(xiàn)的方法。

首先，先創(chuàng)建一個(gè)HTML文檔，在其中添加一個(gè)div元素，并設(shè)置其樣式如下：

<style>  
.box{  
width:200px;  
height:200px;  
background-color:red;  
display:block;  
}  
</style>  
<div class="box"></div>

我們在div元素上添加一個(gè)class名叫做box，然后給這個(gè)box設(shè)置背景色為紅色，大小為200px，當(dāng)頁面加載完成后，div元素會(huì)顯示在頁面上。

添加CSS樣式之后，我們接下來在CSS文件中加入點(diǎn)擊事件，將div元素隱藏。具體代碼如下：

<style>  
.box{  
width:200px;  
height:200px;  
background-color:red;  
display:block;  
}  
.box:active{  
display:none;  
}  
</style>  
<div class="box"></div>

在.box選擇器后面添加 :active 選擇器就可以實(shí)現(xiàn)點(diǎn)擊后隱藏了，當(dāng)鼠標(biāo)點(diǎn)擊div元素時(shí)，事件就會(huì)被觸發(fā)，然后div元素就會(huì)被隱藏。到此為止，我們已經(jīng)完成了CSS點(diǎn)擊后隱藏div的操作。