<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>頁面居中的幾種寫法</title> <style type="text/css"> *{margin: 0px; padding: 0px;} #info{width:80%; height: 800px; background-color: pink;} /* 第1種：*/ #info{margin: 0px auto;} /* 第2種：內邊距，后面的width和overflow必須寫*/ body{ padding: 0 10%; width: 100%; overflow: hidden; } /* 第3種：absolute和relative都可以 */ #info{ position: absolute; left: 10%; } /* 第4種：行內塊級*/ body{ text-align: center; } #info{ display: inline-block; } 第5種：彈性盒子的主軸對齊*/ /*body{ display:flex; justify-content:center; } </style> </head> <body> <div id="info"></div> </body> </html>