是HTML中常用的標簽之一，用于定義文檔中的一個塊（box），通常用于布局網頁。但是，有時候我們需要將這個塊居中顯示，以使頁面看起來更整潔美觀。本文將介紹如何使用CSS實現div居中顯示。 首先，我們需要給div設置一個寬度和高度，否則它將根據內容自動縮放大小。我們可以使用CSS中的width和height屬性定義寬度和高度。為了更好地演示效果，我們給div加上一個背景色。

<div style="background-color: #EEE; width: 200px; height: 100px;">
<p>這是一個div</p>
</div>

接下來，我們使用CSS將這個div居中。一般來說，有三種方法可以實現div居中。 1. 使用margin屬性 margin是CSS中控制元素外邊距的屬性。可以將div向下和向右移動一定的距離，從而實現居中顯示。

<style>
div{
background-color: #EEE;
width: 200px;
height: 100px;
margin: auto;
}
</style>
<div>
<p>這是一個div</p>
</div>

2. 使用position和margin屬性 position屬性可以設置元素的定位方式，可以將元素相對于屏幕、父元素或文檔定位。我們可以使用position屬性將div絕對定位，再用margin將其居中。

<style>
div{
background-color: #EEE;
width: 200px;
height: 100px;
position: absolute;  
top: 50%;
left: 50%;
margin-left: -100px;  /* 寬度的一半 */
margin-top: -50px	  /* 高度的一半 */
}
</style>
<div>
<p>這是一個div</p>
</div>

3. 使用flexbox布局 flexbox是CSS3中提供的一種彈性布局模型，可以輕松地實現元素的對齊和布局。我們可以將display屬性設置為flex，再使用justify-content和align-items屬性將div居中。

<style>
.container{
display: flex;
justify-content: center;
align-items: center;
height: 100vh;	/* 設置高度為視口高度 */
}
div{
background-color: #EEE;
width: 200px;
height: 100px; 
}
</style>
<div class="container">
<div>
<p>這是一個div</p>
</div>
</div>

三種方法均可以實現div居中，具體使用哪種方法取決于頁面布局和個人喜好。希望本文能夠幫助大家更好地掌握div居中方法。