要想使一個盒子居中顯示，可以使用CSS的布局屬性來控制其位置，下面介紹幾種實現方式： 1. 使用margin屬性 在CSS中，可以使用margin屬性控制元素與其周圍元素之間的間距。如果將該元素的上下左右margin設為auto，則該元素就會水平和垂直居中。

<div class="box">
<p>這是一個居中顯示的盒子</p>
</div>
.box {
margin: auto;
width: 300px;
height: 200px;
}

2. 使用flex布局 在CSS3中引入了flex布局，可以方便地實現盒子的水平和垂直居中。設置容器的display屬性為flex，并使用justify-content和align-items屬性來控制元素的對齊方式。

<div class="box">
<p>這是一個居中顯示的盒子</p>
</div>
.box {
display: flex;
justify-content: center;
align-items: center;
width: 300px;
height: 200px;
}

3. 使用絕對定位 可以將該元素的position屬性設置為absolute，并將其在父元素中水平和垂直居中。父元素需要設置為relative定位。

<div class="parent">
<div class="box">
<p>這是一個居中顯示的盒子</p>
</div>
</div>
.parent {
position: relative;
}
.box {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 300px;
height: 200px;
}

以上是三種使盒子水平和垂直居中的方法，可以根據具體情況進行選擇。預格式化文本可以使用pre標簽進行標記，可以保留文本中原有的空白和換行符。

<pre>
代碼塊

或者可以使用行內元素p標簽包裹代碼塊進行展示。

代碼塊