@charset "utf-8"; /* 背景图 */ .back div { padding-bottom: 172px; } /* 内容区 */ .con { width: 100%; padding: 100px 0; background: #fff; font-size: 0; min-width:1400px; } .con .left { float: left; position: relative; overflow: hidden; width: 19%; min-width: 225px; } .con .left a { display: block; } .con .left p { width: 80%; color: #fff; font-size: 30px; line-height: 30px; text-align: center; position: absolute; left: 10%; bottom: 100px; z-index: 10; } .con ul li { width: 27%; display: inline-block; float: left; position: relative; overflow: hidden; height: 15rem;min-width: 325px;min-height: 270px; } .con ul li a{display:block;overflow: hidden;height: 15rem;min-width: 325px;min-height: 270px;} .con ul li p { width: 80%; color: #fff; font-size: 30px; line-height: 35px; text-align: center; position: absolute; left: 10%; top: 80px; z-index: 10; word-wrap: break-word; word-break:normal; } .con .left .yinying, .con ul li .yinying { width: 100%; height: 100%; background: #000; opacity: 1; z-index: 2; position: absolute; top: 0; left: 0; display: none; } .con .left a img {width: 100%;height: 30rem;transition: all 2s;min-width: 225px;min-height: 540px;} .con ul li a img { width: 100%; height: 15rem; transition: all 2s; min-width: 325px; min-height: 270px; } .con .left a:hover img, .con ul li a:hover img { transform: scale(1.2); } .con .left a:hover .yinying, .con ul li a:hover .yinying { display: block; opacity: 0.4; filter: alpha(opacity=40); /* IE */ -moz-opacity: 0.4; /* 老版Mozilla */ -khtml-opacity: 0.4; /* 老版Safari */ }