* { margin:0; padding:0; border:0; list-style:none; } .b1 { width:400px; height:480px; margin:0 auto; margin-top:100px; border:1px #7fa2a1 solid; position:relative; } .b1 ul { display:flex; } .b1 ul li { margin:auto; } .b1 ul li img { width:50px; height:50px; display:block; } .bian { border:2px red solid; } .b2 img { width:400px; height:400px; margin-bottom:15px; position:relative; } .b2 .sm { width:150px; height:150px; background-color:#000; opacity:0.5; filter:alpha(opacity=50); position:absolute; top:0; left:0; display:none; } .rig { width:400px; height:400px; border:1px #7fa2a1 solid; position:absolute; top:0; left:400px; overflow:hidden; display:none; } .rig img { position:absolute; left:0; top:0; }