为什么我的隐藏和显示的基本CSS代码不起作用？

Question

我使用谷歌浏览器,我希望当我将鼠标悬停在它上面时,背景的配置文件消失.但是唉它没有......我确定我做的事情从根本上说是错误的.请解释

HTML

<body>
<div id ="pictures">
profile
</div>

CSS

#pictures {
    height: 100px;
    width: 200px;
    display: block;
    background-color:#FCC;
}
#pictures:hover {
    display: none;
}

Answer 1

你最好不要使用opacity: 0以避免任何怪异(正如Danjah已经解释过的那样).

#pictures:hover {
    opacity: 0;
    filter: alpha(opacity=0);
}