CSS是網頁設計中的必備技能之一，其中平移自身50%是一個常見的操作，可以使元素在頁面上垂直居中。下面就來詳細介紹一下CSS平移自身50%的用法。

代碼示例：
.element {
position: absolute; /* 或 relative */
top: 50%;  /* 向下移動元素自身高度的一半 */
left: 50%; /* 向右移動元素自身寬度的一半 */
transform: translate(-50%, -50%); /* 平移自身50% */
}

上面是一個簡單的CSS代碼示例，其中包括了position、top、left以及transform等幾個關鍵屬性，下面詳細解釋一下。

首先，使用position屬性指定元素的定位方式，可以為absolute或relative。

其次，使用top和left屬性將元素移動到水平和垂直方向的中心位置，這里需要注意的是，top值為50%的定位是元素頂部距離父級元素頂部的距離，而left值為50%的定位是元素左側距離父級元素左側的距離。

最后，使用transform屬性的translate函數，實現平移自身50%的效果。其中第一個參數表示向左移動元素寬度的一半，而第二個參數表示向上移動元素高度的一半。這樣就可以使元素在頁面上垂直居中了。