이웃집의 토토로
야옹이 버스!!
<style> * { margin:0px; padding:0px; text-decoration:none; } section { width:100%; height:500px; text-align:center; } .imgBox { margin:20px; display:inline-block; text-align:center; background-repeat:no-repeat; background-position:50% 50%; } .imgBox a { width:500px; height:500px; display:table-cell; vertical-align:middle; color:#fff; transition:all .3s ease; -moz-transition:all .3s ease; -webkit-transition:all .3s ease; opacity:0; } .bg01 { background-image:url("https://postfiles.pstatic.net/MjAxODA0MjFfNSAg/MDAxNTI0MjkwNzMwODg5.UR4wYoHPhVtialOTKmND1FpPS8rhMfCj3StHGx0B89wg.Dc5iF1NOxxtDn4xp4uf5WWPMbprF86OhXABr1cI-5Mwg.JPEG.domtype/01.jpg?type=w966"); } .bg02 { background-image:url("https://postfiles.pstatic.net/MjAxODA0MjFfMjgy/MDAxNTI0MzA5NjkyOTc4.pmgj0sAYXl_hp88rMJRGOVPXRilGI0gsaC-C4oTXIsog.dF6PME7XLXc1pI2v_htrvlJ74QSKFzLd22NgvQpU4Gsg.JPEG.domtype/02.jpg?type=w966"); } .imgBox a:hover { background:rgba(0,0,0,.7); opacity:1; } </style> <section> <div class="imgBox bg01"> <a href="#">porsche 911 GTS Models</a> </div> <div class="imgBox bg02"> <a href="#">porsche 911 Targa 4 Models</a> </div> </section>