這篇文章主要介紹css中媒體查詢指的是什么，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

正藍(lán)ssl適用于網(wǎng)站、小程序/APP、API接口等需要進(jìn)行數(shù)據(jù)傳輸應(yīng)用場(chǎng)景，ssl證書未來市場(chǎng)廣闊！成為成都創(chuàng)新互聯(lián)公司的ssl證書銷售渠道，可以享受市場(chǎng)價(jià)格4-6折優(yōu)惠！如果有意向歡迎電話聯(lián)系或者加微信：18982081108（備注：SSL證書合作）期待與您的合作！

                              本篇文章給介紹媒體查詢是什么？怎么使用？讓大家了解媒體查詢的使用方法。有一定的參考價(jià)值，有需要的朋友可以參考一下，希望對(duì)你們有所幫助。

媒體查詢是什么？有什么用？

媒體查詢限制CSS樣式的范圍，以便僅在滿足某些媒體條件時(shí)才適用。

簡(jiǎn)單來說：媒體查詢可以讓我們根據(jù)設(shè)備顯示器的特性（如視口寬度、屏幕比例、設(shè)備方向：橫向或縱向）為其設(shè)定CSS樣式。

媒體查詢可用于檢測(cè)的媒體特性，比如： width 、 height 和 color （等）。使用媒體查詢，可以在不改變頁面內(nèi)容的情況下，為特定的一些輸出設(shè)備定制顯示效果?！鞠嚓P(guān)視頻教程推薦：css3教程】

媒體查詢是怎么使用的？

我們可以將媒體查詢視為瀏覽器的if-else語句來解釋，媒體查詢是評(píng)估為真或假的邏輯表達(dá)式。媒體查詢包括可選的媒體類型、零個(gè)或多個(gè)媒體特性以及允許構(gòu)造更復(fù)雜表達(dá)式的邏輯關(guān)鍵字。

1、基本語法：

@media [not | only] <media-type> [and] (<media-condition>);

media-type（媒體類型）

媒體類型是可以顯示HTML文檔的廣泛類別的用戶代理設(shè)備。媒體類型列表已在媒體查詢級(jí)別4規(guī)范中進(jìn)行了修訂。已棄用的媒體類型被識(shí)別為有效，但不會(huì)與任何設(shè)備匹配，即您的媒體查詢?nèi)詫⑦m用，但在所有設(shè)備上都應(yīng)用，就像沒有指定媒體類型一樣。

可以設(shè)置以列的媒體類型：

all：匹配所有設(shè)備。

print：匹配打印機(jī)和用于再現(xiàn)打印顯示的設(shè)備，例如在“預(yù)覽”中顯示文檔的Web瀏覽器。

screen：匹配所有與打印或語音不匹配的設(shè)備。

speech：匹配屏幕閱讀器和“讀出”頁面的類似設(shè)備。

媒體功能比媒體類型更精細(xì)，因?yàn)樗槍?duì)相關(guān)設(shè)備設(shè)置單個(gè)特定功能。媒體功能的語法與CSS屬性相同，包括功能名稱，冒號(hào)和要測(cè)試的值都相同。

媒體功能列表也已從介質(zhì)查詢級(jí)別3更改為介質(zhì)查詢級(jí)別4；已棄用的功能已保留在規(guī)范中以便向后兼容，但強(qiáng)調(diào)它們不得用于新樣式表。用戶代理仍將按指定繼續(xù)支持它們。

可以設(shè)置以列的媒體功能：

屏幕/設(shè)備的尺寸：
   width
   height
   aspect-ratio
   orientation

顯示質(zhì)量：
   resolution
   scan
   grid
   update
   overflow-block
   overflow-inline

顏色：
   color
   color-index
   monochrome
   color-gamut

相互作用：
   pointer
   hover
   any-pointer 和 any-hover

腳本：
   scripting：

實(shí)現(xiàn)CSS響應(yīng)式媒體查詢

例:

@media screen and (max-width:720px) and (min-width:320px){
      body{
       background-color:red;
       }
@media screen and (max-width:320px){
      body{
         background-color:blue;
       }
}

說明：

該段媒體查詢的意思是：當(dāng)設(shè)備屏幕寬度在320px~~720px之間時(shí)，媒體查詢?cè)O(shè)置body的背景色（background-color:red;）會(huì)重疊之前的body背景色；當(dāng)設(shè)備屏幕寬度在320px以下時(shí)，媒體查詢可以設(shè)置body的背景色（background-color:blue;），同樣會(huì)重疊之前的body背景色。

基于媒體信息應(yīng)用樣式的方法，包括頁面和設(shè)備尺寸等內(nèi)容。

可以支持以下版本：

以上是css中媒體查詢指的是什么的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。

新聞標(biāo)題：css中媒體查詢指的是什么-創(chuàng)新互聯(lián)
網(wǎng)站鏈接：http://www.rwnh.cn/article30/cchgso.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供App設(shè)計(jì)、手機(jī)網(wǎng)站建設(shè)、品牌網(wǎng)站建設(shè)、標(biāo)簽優(yōu)化、網(wǎng)站排名、企業(yè)網(wǎng)站制作

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)