在移動互聯網的時代，手機端網站已經成為人們日常生活中不可或缺的一部分。為了在不同尺寸屏幕的設備上顯示良好，網站的css樣式尤為重要。下面是手機端網站css怎么寫的一些方法。 首先，在為手機端網站設計css時，需要考慮到不同尺寸屏幕的設備，以及橫豎屏的顯示效果。通過媒體查詢，可以設置不同的樣式以適應不同的設備。 例如，以下代碼展示了在不同設備尺寸下的字號和行高樣式的設定：

@media only screen and (max-width: 640px) {
p {
font-size: 14px;
line-height: 1.5;
}
}
@media only screen and (min-width: 641px) {
p {
font-size: 18px;
line-height: 1.8;
}
}

其次，在為手機端網站設計樣式時，需要考慮到頁面加載速度的問題。因為手機客戶端的網絡環境不穩定，所以要盡可能減少css文件的大小。可以通過以下方法實現： - 刪除不必要的樣式 - 將多個樣式合并為一個 - 壓縮css文件 以下是一個例子：

/* 錯誤的css寫法 */
.my-class {
background-color: red;
margin-top: 10px;
margin-bottom: 20px;
margin-left: 15px;
margin-right: 15px;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 10px;
padding-right: 10px;
}
/* 正確優化后的寫法 */
.my-class {
background-color: red;
margin: 10px 15px 20px;
padding: 5px 10px;
}

最后，需要注意的是，為了滿足不同設備的高分辨率要求，也需要為圖片添加相應的css樣式。以下是針對高清屏幕的圖片css樣式設置：

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
.logo {
background-image: url("logo@2x.png");
background-size: 100%;
background-repeat: no-repeat;
}
}

總之，在為手機端網站設計css時，需要考慮很多因素，如設備尺寸、頁面加載速度和高清屏幕等。通過在樣式中使用媒體查詢、優化css代碼和為圖片添加樣式等方法，可以讓網站在移動設備上呈現出更佳的效果。