CSS 如何讓 div 居中？ 在網頁布局中，我們經常需要把某個 div 居中顯示。下面介紹幾種常用的方法： 方法一：使用 margin 我們可以使用 margin 屬性來讓一個 div 在水平和垂直方向上都實現居中布局。例如： ``` div { width: 200px; height: 100px; margin: auto; } ``` 其中，`auto` 值表示自動計算 margin 值，從而達到居中布局的效果。 注意：這種方法只適用于在已知寬度和高度的情況下實現居中布局。 方法二：使用 Flexbox Flexbox 是一種強大的布局方式，可以快速地實現各種復雜的網頁布局。以下是使用 Flexbox 居中 div 的示例代碼： ``` .container { display: flex; justify-content: center; align-items: center; } ``` 其中，`.container` 是包含 div 的容器元素。 方法三：使用 Grid Grid 是另一種強大的布局方式，也可以用來實現居中布局。 ``` .container { display: grid; place-items: center; } ``` 其中，`.container` 是包含 div 的容器元素。 總結 以上三種方法都適用于在已知寬度和高度的情況下實現居中布局。如果不知道寬度和高度，可以使用 JavaScript 動態計算并設置居中的值。 CSS 居中布局是網頁布局的常見需求，掌握以上技巧可以幫助我們更快地實現各種復雜的網頁布局。