在如今的移動設(shè)備時代，人們離不開手機。不管是上網(wǎng)、看視頻、聊天還是玩游戲，手機幾乎是人們?nèi)粘Ｉ钪斜夭豢缮俚墓ぞ摺６谶@些操作中，我們最接觸的就是手機網(wǎng)頁。那么，如何讓手機網(wǎng)頁更加美觀、舒適呢？很簡單，通過CSS樣式的設(shè)置，我們就可以讓手機網(wǎng)頁變得更加出色。下面，我們就來介紹一下手機網(wǎng)頁CSS樣式的設(shè)置。

/* 常用的 CSS 屬性 */
body {
background-color: #fff;
font-family: Arial, sans-serif;
font-size: 16px;
line-height: 1.5;
color: #333;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Helvetica Neue', sans-serif;
font-weight: bold;
text-align: center;
margin: 1rem auto;
}
a {
color: #0066cc;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
button, input[type="submit"] {
background-color: #0066cc;
border: none;
color: #fff;
font-size: 1.2rem;
padding: 0.8rem 1.5rem;
border-radius: 3px;
}
button:hover, input[type="submit"]:hover {
background-color: #0050a0;
}

上面的代碼是一些常見的CSS屬性，包含了字體、顏色、背景、按鈕等等，這些屬性都可以用來優(yōu)化手機網(wǎng)頁顯示效果。

為了更好地適配手機屏幕，我們可以使用@media查詢。通過這個CSS3新屬性，我們可以根據(jù)不同的屏幕大小，為網(wǎng)頁設(shè)置不同的樣式。例如，以下代碼可以讓網(wǎng)頁在小于768px的屏幕上，字體大小變?yōu)?4px：

@media screen and (max-width: 768px) {
body {
font-size: 14px;
}
}

通過調(diào)整CSS樣式，我們可以使手機網(wǎng)頁更加符合用戶習(xí)慣，提升用戶體驗。在實際的開發(fā)過程中，我們需要結(jié)合不同的需求和特點，設(shè)置出最適合的CSS樣式。