鼠标放上去，图片上方动态显示半透明说明文字(源码)|
.itemInWorks{
width: 240px;
height: 150px;
border-radius:5px;
font-size: 20px;
font-weight: 600;
color: #FFFFFF;
text-align: center;
line-height: 40px;
background: url(/wp-content/uploads//04/10.png);
background-repeat: no-repeat;
background-size: 240px 150px;
box-shadow: #909090 0px 0px 10px;
overflow: hidden;
position: relative;
}
/*半透明部分*/
.itemInWorks .mask{
height:60px;
width:232px;
color: #f5f1e5;
line-height: 23px;
text-align: left;
padding-left: 8px;
border-radius:2px 2px 5px 5px;
font-size: 14px;
font-weight: 300;
position: absolute;
top:150px;
background-color:rgba(0,0,0,0.5);
transition:top 0.5s ease-in-out;
}
.itemInWorks:hover .mask{
top:90px ;
}
网页设计
日期：/02/14
提示：你可以先修改部分代码再运行。
