隨著移動設備的普及，越來越多的用戶使用手機進行網上活動。因此，現在的網站設計必須考慮到手機用戶的需求。為了適應手機設備上的各種屏幕尺寸和分辨率，CSS樣式的設置是必不可少的。

/* 設置手機樣式 */
@media only screen and (max-width: 767px) {
/* 這里編寫手機端的CSS樣式 */
body {
font-size: 16px;
}
.container {
width: 100%;
padding: 20px;
}
.header {
height: 50px;
background: #333;
color: #fff;
text-align: center;
line-height: 50px;
font-size: 20px;
}
.menu {
display: none;
}
.content {
padding: 20px;
font-size: 18px;
line-height: 30px;
}
.footer {
height: 50px;
background: #333;
color: #fff;
text-align: center;
line-height: 50px;
font-size: 16px;
}
}

如上代碼中所示，我們通過@media查詢語句來判斷當前設備是否為手機設備。當分辨率小于等于767px時，即代表用戶正在使用手機訪問網站，此時我們就可以為手機端設置相應樣式。在上面的代碼中，我們對字體大小、容器寬度、導航菜單等進行了相應的調整。

通過以上設置，我們可以確保網站在不同設備上都能夠呈現出最佳的視覺效果。當然，除了以上這些常用的設置之外，還有許多其他的CSS樣式可以使用。只要我們根據不同需求進行相應的設置，就能讓我們的網站在各類設備上都能夠表現得盡善盡美。