在CSS3中，實現上下居中的效果有多種方式。其中，可以使用flexbox和transform屬性實現。 使用flexbox實現上下居中，我們需要將父元素的display屬性設置為flex，并使用align-items和justify-content屬性進行對齊。示例代碼如下：

p {
display: flex;
align-items: center;
justify-content: center;
height: 200px;  // 父元素高度
}

使用transform實現上下居中，主要是通過設置子元素的position屬性為absolute，并在父元素中使用transform屬性來實現。示例代碼如下：

p {
position: relative;  // 父元素設置相對定位
height: 200px;  // 父元素高度
}
p span {
position: absolute;  // 子元素設置絕對定位
top: 50%;  // 子元素頂部距離父元素頂部的距離
transform: translateY(-50%);  // 沿Y軸移動自身高度的一半
}

以上兩種方法都能實現上下居中的效果，選擇哪種方式可以根據實際需求和兼容性考慮。同時，還可以使用margin和line-height屬性實現簡單的居中效果。