div中的div标签居中
1 <!DOCTYPE html> 2 <html lang="zh-CN"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>居中练习</title> 6 <style> 7 .out { 8 background-color:green; 9 width:400px; 10 height:400px; 11 position:relative; 12 } 13 14 .in { 15 background-color:red; 16 width:100px; 17 height:100px; 18 position:absolute; 19 top:50%; 20 left:50%; 21 margin-top:-50px; 22 margin-left:-50px; 23 } 24 </style> 25 </head> 26 <body> 27 28 <div class="out"> 29 <div class="in"></div> 30 </div> 31 32 33 </body> 34 </html>