在現代的網頁設計中，滑動屏幕已經成為一種比較普遍的設計要素，可以為用戶帶來更好的體驗。而通過添加CSS，可以讓滑動屏幕的效果更加生動。

/**
 * 添加滑動屏幕的動畫
 */
.slideInRight {
animation-name: slideInRight;
animation-duration: 1s;
animation-fill-mode: both;
}
/**
 * 設置動畫的起始狀態和結束狀態
 */
@keyframes slideInRight {
from {
transform: translateX(100%);
visibility: visible;
}
to {
transform: translateX(0%);
}
}

首先，我們需要定義一個CSS的class，來指定滑動屏幕的動畫。在這個例子中，我們使用了一個名稱為slideInRight的class，這個class將會定義從右邊滑動進入的動畫效果。

接著，在class中，我們使用了CSS3的動畫特性，來定義動畫的執行方式。通過animation-duration屬性，我們設置了動畫執行的時間為1秒鐘。而通過animation-fill-mode屬性，我們指定了動畫執行完畢后，元素的狀態將會保持在動畫結束的狀態上。

/**
 * 滑動屏幕的HTML代碼
 */
Hello, World!
This is a sample text.

最后，在HTML代碼中，我們需要將定義好的CSS class應用到相應的元素上，來使得它們擁有滑動屏幕的效果。在這個例子中，我們創建了一個div元素，并且將class為slideInRight的CSS class應用到里面的所有子元素上。

這樣，我們就完成了滑動屏幕的設計，并且通過CSS為其添加了動畫效果，讓頁面更加生動有趣了。