效果如下： css代码： <br /> *{<br /> padding:0;<br /> margin:0;font-family:"宋体";<br /> box-sizing: content-box;<br /> -webkit-box-sizing: content-box;}<br /> .wrap {<br /> position: relative;<br /> width: 300px;<br /> height:200px;<br /> margin: 0 auto;<br /> }<br /> .box {<br /> width: 300px;<br /> height:200px;<br /> margin: 10px;<br /> float: left;<br /> border: 10px solid #fff;<br /> overflow: hidden;<br /> position: relative;<br /> text-align: center;<br /> -webkit-box-shadow: 1px 1px 2px #e6e6e6,-1px -1px 2px #e6e6e6;<br /> -moz-box-shadow: 1px 1px 2px #e6e6e6,-1px -1px 2px #e6e6e6;<br /> box-shadow: 1px 1px 2px #e6e6e6,-1px -1px 2px #e6e6e6;<br /> cursor: default;<br /> }<br /> <br /> .box img {<br /> width:300px;<br /> height:200px;<br /> display: block;<br /> position: relative;<br /> max-width:100%;<br /> -webkit-transform: scaleY(1);<br /> -moz-transform: scaleY(1);<br /> -o-transform: scaleY(1);<br /> -ms-transform: scaleY(1);<br /> transform: scaleY(1);<br /> -webkit-transition: all 0.7s ease-in-out;<br /> -moz-transition: all 0.7s ease-in-out;<br /> -o-transition: all 0.7s ease-in-out;<br /> -ms-transition: all 0.7s ease-in-out;<br /> transition: all 0.7s ease-in-out;<br /> }<br /> .box .mask {<br /> overflow:hidden;<br /> position:absolute;<br /> background-color:#960;<br /> left:0px;top:0px;width:300px; height:200px;<br /> -webkit-transition: all 0.5s linear;<br /> -moz-transition: all 0.5s linear;<br /> -o-transition: all 0.5s linear;<br /> -ms-transition: all 0.5s linear;<br /> transition: all 0.5s linear;<br /> -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";<br /> filter: alpha(opacity=0);<br /> opacity: 0;<br /> }<br /> <br /> .box p {<br /> font-size:12px;<br /> line-height:30px;<br /> position: relative; <br /> padding: 10px 20px 20px;<br /> text-align: left;<br /> color: #333;<br /> -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";<br /> filter: alpha(opacity=0);<br /> opacity: 0;<br /> -webkit-transform: scale(0);<br /> -moz-transform: scale(0);<br /> -o-transform: scale(0);<br /> -ms-transform: scale(0);<br /> transform: scale(0);<br /> -webkit-transition: all 0.5s linear;<br /> -moz-transition: all 0.5s linear;<br /> -o-transition: all 0.5s linear;<br /> -ms-transition: all 0.5s linear;<br /> transition: all 0.5s linear;<br /> }<br /> <br /> .box:hover img {<br /> width:300px; height:200px;<br /> -webkit-transform: scale(2);<br /> -moz-transform: scale(2);<br /> -o-transform: scale(2);<br /> -ms-transform: scale(2);<br /> transform: scale(2);<br /> -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";<br /> filter: alpha(opacity=0);<br /> opacity: 0;<br /> }<br /> .box:hover .mask {<br /> -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";<br /> filter: alpha(opacity=100);<br /> opacity: 1;<br /> }<br /> <br /> .box:hover p<br /> { color:#fff;<br /> -webkit-transform: scale(1);<br /> -moz-transform: scale(1);<br /> -o-transform: scale(1);<br /> -ms-transform: scale(1);<br /> transform: scale(1);<br /> -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";<br /> filter: alpha(opacity=100);<br /> opacity: 1;<br /> } <br /> html代码： 2014年末北京市常住人口2151.6万人，比2013年末增加36.8万人。其中，常住外来人口818.7万人，占常住人口的比重为38.1%。常住人口中，城镇人口1859万人，占常住人口的比重为86.4%。常住人口出生率9.75‰，死亡率4.92‰，自然增长率4.83‰。常住人口密度为每平方千米
