如何使div居中-簡單實現

版權聲明：本文爲博主原創文章，未經博主允許不得轉載。 https://blog.csdn.net/FKCSSS/article/details/49737581

1.CSS讓DIV水平居中

.mydiv{   
    margin:0 auto;   
    width:300px;   
    height:200px;   
}  

2.CSS實現水平和垂直居中

.mydiv{ 
   width:300px;  
   height:200px;  
   position:absolute;  
   left:50%;  
   top:50%;  
   margin:-100px 0 0 -150px 
} 

3.jQuery實現水平和垂直居中

$(window).resize(function(){ 
    $(".mydiv").css({ 
        position: "absolute", 
        left: ($(window).width() - $(".mydiv").outerWidth())/2, 
        top: ($(window).height() - $(".mydiv").outerHeight())/2 
    });        
});