CSS點擊事件圖片消失

img {
display: block;
margin: 0 auto;
}
img:hover {
opacity: 0.5;
cursor: pointer;
}
img:active {
display: none;
}

實現(xiàn)方法：

1. 首先，在HTML中添加圖片標簽<img>

<img src="picture.jpg">

2. 在CSS中添加樣式：

img {
display: block; // 將圖片設置為塊狀元素
margin: 0 auto; // 水平居中
}
img:hover {
opacity: 0.5; // 鼠標懸停時設置透明度為0.5
cursor: pointer; // 鼠標懸停時顯示手型
}
img:active {
display: none; // 點擊圖片時設置display屬性為none，隱藏圖片
}

3. 最終效果：