*{margin:0;padding:0;list-style:none;}

.main .view{ width:290px; height:342px; overflow:hidden; position:relative; margin:10px; float:left;}
.main .hover{
	width:290px; background:rgba(0, 0 ,0 ,0.5); position:absolute; top:0px; left:0; text-align:center; color:#fff;
	transform:rotate(55deg);
	-moz-transform:rotate(55deg);
	-webkit-transform:rotate(55deg);
	transition:all 0.5s;
	-moz-transition:all 0.5s;
	-webkit-transition:all 0.5s;
	overflow:hidden; height:0; z-index:4000;/*transform:translateX(200px);*/}/*写好样式，进行隐藏，用overflow:hidden; height:0;*/
.main .hover h3{color:#fff; border-bottom:2px solid rgba(255, 255 ,255, 0.5); padding-bottom:10px;padding-top: 20px;}
.main .hover p{line-height: 100%;padding: 10px 0;}
.main .view:hover .hover{height:342px;transform:rotate(0deg);-moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);}
/*before   after为选择器，一般给选择器加动画背景，设置动画样式*/


}/*写好样式，进行隐藏，用top:-240px;*/

.main .view:hover:after{ bottom:0px;}