在移動端開發中，頭部可以滑動是非常常見的需求。通過CSS實現這一功能也很簡單。我們可以使用CSS3中的Flex布局來實現移動端頭部的滑動效果。

首先，在HTML中，我們需要將頭部元素包裹在一個容器里。例如：

<div class="header-container">
<nav class="header-nav">
<a href="#">菜單1</a>
<a href="#">菜單2</a>
<a href="#">菜單3</a>
<a href="#">菜單4</a>
<a href="#">菜單5</a>
</nav>
</div>

接著，在CSS中，我們使用Flex布局，將包裹頭部元素的容器設置為Flex容器，使其能夠自動調整元素的寬度和高度。例如：

.header-container {
display: flex; /*設置為Flex容器*/
overflow-x: auto; /*開啟水平滾動*/
-webkit-overflow-scrolling: touch; /*開啟滾動流暢度優化*/
}
.header-nav {
display: flex; /*將頭部導航也設置為Flex容器*/
align-items: center; /*垂直居中*/
}

通過設置Flex容器的overflow-x屬性，我們開啟了水平滾動效果。同時，通過添加-webkit-overflow-scrolling: touch屬性，我們還開啟了滾動流暢度的優化，提升了用戶體驗。

經過這樣的設置后，當設備屏幕過小，頭部元素的寬度就會自動調整，并且出現水平滾動條，可以左右滑動頭部元素。

總的來說，使用Flex布局可以讓我們輕松實現移動端頭部滑動效果，提升了用戶體驗。同時，這個方法也適用于其他需要自適應調整寬度的移動端UI元素，例如菜單、導航欄等。