隨著移動設(shè)備的日益普及和屏幕尺寸的不斷增加，網(wǎng)頁的自適應(yīng)性越來越受到重視。其中，CSS技術(shù)的運用是實現(xiàn)屏幕自適應(yīng)的重要手段之一。

/* 定義viewport */
<meta name="viewport" content="width=device-width,initial-scale=1.0">
/* 設(shè)計稿中的寬度為750px */
/* 根據(jù)設(shè)備屏幕寬度計算出實際應(yīng)該顯示的寬度 */
/* 750 / viewport的寬度 */
html {
font-size: calc(100% / 7.5);
}
/* 以rem作為單位進行布局 */
/* 根據(jù)設(shè)備屏幕寬度動態(tài)調(diào)整html元素的font-size */
@media screen and (min-width: 320px) {
 html {
font-size: calc(320px / 7.5);
 }
}
@media screen and (min-width: 375px) {
 html {
font-size: calc(375px / 7.5);
 }
}
@media screen and (min-width: 414px) {
 html {
font-size: calc(414px / 7.5);
 }
}

上述代碼中，首先通過標(biāo)簽定義viewport的尺寸。然后，根據(jù)設(shè)計稿的寬度，計算出每個rem所代表的像素數(shù)。接著，使用@media媒體查詢根據(jù)不同的屏幕寬度進行適配，動態(tài)調(diào)整html元素的font-size，從而實現(xiàn)屏幕自適應(yīng)的效果。

除了動態(tài)調(diào)整font-size之外，還可以通過CSS的其他屬性進行屏幕自適應(yīng)，例如使用百分比單位、使用max-width和min-width等等。總之，要實現(xiàn)好屏幕自適應(yīng)，需要綜合運用多種CSS技術(shù)，并針對不同的場景選擇不同的方法。