讓div在屏幕中居中(水平居中+垂直居中)的幾種方法


水平居中方法:

1.inline,inline-block元素的水平居中,在父級塊級元素中設置text-align:center;

 

2.確定寬度的塊級元素水平居中方法

margin:0 auto;

 

 

絕對定位和margin-left:-(width/2)實現水平居中:

 

絕對定位+margin:0 auto + left:0 right:0 bottom:0 top:0

 

3.位置寬度的塊級元素居中方法:

display:inline-block 設置text-align:center;

 

flex布局實現居中

 

 

垂直居中實現方法:

1.固定高度實現垂直居中

height+line-height

 

絕對定位+margin-top賦值

 

2.高度自適應實現垂直居中:

flex布局:

 

 

 

 

 

職業選擇、求職輔導、學習規划、困難答疑、技術交流等,可以加IT交流群828691304

 歡迎訪問我們的官網:技能樹.IT修真院

“我們相信人人都可以成為一個工程師,現在開始,找個師兄,帶你入門,學習的路上不再迷茫。

這里是技能樹.IT修真院,初學者轉行到互聯網行業的聚集地。"


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM