显示属性隐藏(CSS中元素的显示和隐藏及其应用)

　　* {

　　margin: 0;

　　padding: 0;

　　}

　　.outer {

　　position: relative;

　　width: 520px;

　　height: 280px;

　　}

　　/* mask元素，默认不显示，设置为绝对定位，其父元素设置为相对定位 */

　　.mask {

　　display: none;

　　position: absolute;

　　top: 0;

　　left: 0;

　　width: 100%;

　　height: 100%;

　　/* 设置mask元素的背景的颜色、图标 */

　　background: rgba(12, 12, 12, 0.2) url(imges/arrow.png) no-repeat center;

　　}

　　/* 伪类实现鼠标进入mask元素时效果 */

　　.outer:hover .mask {

　　display: block;

　　}