CSS圖文滾動展示窗是一種非常方便展示圖片和文字內容的方式，通過CSS樣式設置可以實現自動輪播和手動切換的效果。

/* CSS代碼 */
.carousel {
position: relative;
width: 100%;
height: 400px;
overflow: hidden;
}
.carousel-slider {
position: absolute;
width: 100%;
height: 100%;
display: flex;
transition: transform 0.5s ease-in-out;
}
.carousel-item {
flex-shrink: 0;
width: 100%;
height: 100%;
}
.carousel-item img {
width: 100%;
height: 100%;
object-fit: cover;
}
.carousel-nav {
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
display: flex;
}
.carousel-nav-item {
margin-right: 10px;
width: 10px;
height: 10px;
border-radius: 50%;
background-color: #ccc;
cursor: pointer;
}
.carousel-nav-item.active {
background-color: #333;
}

上面的CSS代碼中，我們首先定義了一個.carousel的容器，并且設置了其position屬性為relative，width為100%以及height為400px，overflow為hidden以隱藏超出容器的部分。在.carousel容器內，我們定義了一個.carousel-slider項作為滾動窗口，為了實現水平滾動的效果，我們將其display屬性設置為flex，并且添加了transform屬性來控制其偏移，實現行進動畫效果。在.carousel-slider內，我們定義了多個.carousel-item元素作為圖片輪播的項，其flex-shrink屬性被設置為0，表示子項不隨flex容器的縮放而縮放。在.carousel-item內定義的img，其display屬性為block，width為100%，height為100%以填滿.carousel-item容器，object-fit屬性為cover可以讓圖片等比例縮放并且填充.carousel-item容器。

為了實現切換按鈕，我們在.carousel容器中定義了一個.carousel-nav元素，其position屬性設置為absolute，bottom屬性設置為20px，left屬性設置為50%并且用transform屬性將其向左移動50%，使其保持在容器底部的中央位置。在.carousel-nav內定義多個.carousel-nav-item元素作為切換按鈕，margin-right屬性為10px，用來保持分布間隔，width屬性和height屬性設置為10px，用來設置圓點的大小， border-radius屬性設置為50%，將其變成圓形，background-color屬性定義其背景顏色（默認為灰色）。通過為carousel-nav-item元素添加active類的樣式來更改其顏色，從而展示為當前活動項的狀態。

通過這些CSS樣式定義，我們可以輕松地創建一個圖片和文字內容的滾動展示窗，同時實現自動輪播和手動切換的效果，使得展示內容更加生動、直觀。