在網(wǎng)頁制作中，為了增強用戶體驗，使網(wǎng)頁看起來更加美觀、規(guī)范化，我們經(jīng)常需要對網(wǎng)頁中的文章進行布局和排版，這時CSS就顯得尤為重要了。
在網(wǎng)頁制作中，我們通常使用p標簽來包含文章中的段落內(nèi)容，使用pre標簽來包含代碼段。但是如果我們只是簡單的使用這兩個標簽，會發(fā)現(xiàn)文章或者代碼不一定是居中顯示的。
為了實現(xiàn)居中對齊的效果，我們需要在CSS中加入如下代碼：

/* 對文章內(nèi)容進行居中對齊 */
p {
text-align: center;
}
/* 對代碼內(nèi)容進行居中對齊 */
pre {
text-align: center;
}

其中，text-align屬性指定了文本的對齊方式，將其設(shè)置為“center”即可實現(xiàn)居中對齊的效果。
在設(shè)置完對齊樣式后，我們只需要在html中使用p標簽包裹文章內(nèi)容，使用pre標簽包裹代碼段即可實現(xiàn)居中對齊的效果。
需要注意的是，在使用pre標簽時，我們還可以設(shè)置該標簽的樣式，使代碼更加易于閱讀。例如，可以加入如下樣式：

pre {
font-family: "Microsoft Yahei", Consolas, monospace;
font-size: 14px;
color: #333;
background-color: #f5f5f5;
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
}

其中，font-family屬性指定了字體，font-size屬性指定了字號，color屬性指定了字體顏色，background-color屬性指定了背景色，padding屬性指定了內(nèi)邊距，border屬性指定了邊框樣式，border-radius屬性指定了邊框圓角弧度。通過這些設(shè)置，我們可以使代碼段的格式更加清晰、易于閱讀。
綜上所述，通過加入合適的CSS樣式，我們可以實現(xiàn)網(wǎng)頁文章和代碼的居中對齊，提升用戶體驗和閱讀體驗。