現在的網頁設計，除了美觀，還要求具有一定的交互性，而 CSS 動態人物就是一種非常有趣的交互方式。通過 CSS 屬性和 JavaScript 代碼的相互配合，可以創造出非常逼真的動態人物，讓網頁更加生動有趣。

在 CSS 中實現動態人物，最常用的方法就是利用 transform 屬性來控制元素的位置、大小、旋轉角度等屬性，同時使用 animation 屬性實現動畫效果。

/* 定義人物的基本信息 */
.man {
width: 100px;
height: 200px;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
}
/* 定義人物動畫 */
@keyframes walk {
0% {
transform: translateX(0) rotateY(0);
}
25% {
transform: translateX(60px) rotateY(0);
}
50% {
transform: translateX(60px) rotateY(180deg);
}
75% {
transform: translateX(0) rotateY(180deg);
}
100% {
transform: translateX(0) rotateY(0);
}
}
/* 實現動態人物 */
.man img {
width: 100px;
height: 200px;
animation: 1s walk infinite;
transform-origin: bottom;
}

上述代碼定義了一個 man 的類，用于描述人物的基本信息。其中，width 和 height 分別表示人物的寬度和高度，position 和 bottom、left 屬性用于控制人物的位置。transform 屬性是實現動態效果的關鍵，通過 translateX() 方法來改變人物的水平位置，rotateY() 方法來改變人物的旋轉角度。

接下來，通過 @keyframes 定義了一段名為 walk 的動畫，該動畫包含了 5 個關鍵幀，每個關鍵幀用 transform 屬性來描述人物在不同狀態下的位置和角度。最后，實現動態人物的代碼是給 man 類中的 img 元素添加動畫效果，同時設置 transform-origin 屬性為 bottom，讓動畫基于人物的底部進行旋轉。

通過這種方法，可以創建出各種不同的動態人物，通過細微的調整就能實現非常逼真的動畫效果。而且，由于動畫效果直接控制的是 CSS 樣式表中的屬性，因此對于網頁的性能也沒有過多的影響。