在前端開發(fā)中，我們通常會(huì)使用CSS來對(duì)網(wǎng)頁進(jìn)行樣式設(shè)計(jì)。但是由于不同設(shè)備、不同分辨率的存在，我們需要在CSS中使用媒體查詢(Media Query)來針對(duì)不同的屏幕大小和設(shè)備類型設(shè)置樣式，以確保頁面在不同設(shè)備上有良好的顯示效果。 媒體查詢是CSS3新增的一項(xiàng)功能，它可以根據(jù)不同終端尺寸的變化，加載不同的CSS樣式。在CSS中，使用@media關(guān)鍵字來定義媒體查詢。下面是一個(gè)簡單的媒體查詢示例：

@media screen and (max-width: 600px) {
p {
font-size: 16px;
}
}

上面的代碼表示，當(dāng)屏幕寬度小于等于600像素時(shí)，p標(biāo)簽的字體大小將設(shè)置為16px。其中，screen表示查詢的設(shè)備類型是屏幕，而max-width: 600px則表示屏幕寬度最大為600像素。 當(dāng)然，媒體查詢還支持多個(gè)條件的組合。例如，我們可以同時(shí)針對(duì)屏幕寬度和屏幕方向進(jìn)行查詢，下面是一個(gè)示例：

@media screen and (max-width: 600px) and (orientation: portrait) {
p {
font-size: 16px;
}
}

上面的代碼表示，當(dāng)屏幕寬度小于等于600像素且屏幕方向?yàn)樨Q屏?xí)r，p標(biāo)簽的字體大小將設(shè)置為16px。 除了screen之外，媒體查詢還支持其他設(shè)備類型，例如print、speech等，可以根據(jù)需要進(jìn)行選擇。另外，還可以針對(duì)分辨率、像素密度、操作系統(tǒng)等條件進(jìn)行查詢。 總之，媒體查詢是CSS中非常重要的一項(xiàng)功能，它可以讓我們根據(jù)不同的設(shè)備類型、屏幕尺寸等因素設(shè)置不同的樣式，從而實(shí)現(xiàn)良好的用戶體驗(yàn)。在實(shí)際開發(fā)中，我們應(yīng)該根據(jù)實(shí)際需要，合理地運(yùn)用媒體查詢來優(yōu)化頁面樣式和布局。