在現(xiàn)代的網(wǎng)頁設(shè)計中，CSS技巧越來越多樣化，但兼容不同設(shè)備的問題一直是設(shè)計師和開發(fā)人員需要面對的一個核心問題，特別是對于手機(jī)用戶來說更是如此。以下是幾個CSS兼容手機(jī)的技巧：

1.使用CSS media查詢設(shè)定視口尺寸

@media screen and (max-width: 480px) { 
/* 小于等于480px寬度的設(shè)備 */
body { width: 100%; }
}

2.使用CSS百分比布局

.container {
width: 100%;
max-width: 960px; /* 設(shè)置最大寬度 */
margin: 0 auto;
}
.column {
float: left;
width: 50%; /* 寬度取百分比 */
}

3.使用CSS3媒體查詢判斷設(shè)備類型

@media only screen and (max-device-width: 768px) {
/* iPad縱向 */
html {
-webkit-text-size-adjust:none;
}
}

4. 使用彈性盒子布局

.container {
display: flex; /* 設(shè)置彈性容器 */
flex-direction: row; /* 設(shè)置彈性容器的方向 */
justify-content: center; /* 水平居中 */
align-items: center; /* 垂直居中 */
}
.item {
flex: 1; /* 伸縮比例 */
}

以上是一些CSS兼容手機(jī)的技巧，但同時也需要注意幾個問題，如CSS文件大小、CSS選擇器性能等，要合理使用CSS技巧，盡量減少不必要的代碼。