溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
小編給大家分享一下css3中媒體查詢的語法簡介，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！
媒體查詢的語法組成是“@media not|only mediatype and (expressions) {CSS代碼...;}”；媒體查詢可由多種媒體組成，可以包含一個或多個表達式，表達式根據(jù)條件是否成立返回true或false。
本教程操作環(huán)境：windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。
CSS3 的多媒體查詢繼承了 CSS2 多媒體類型的所有思想： 取代了查找設備的類型，CSS3 根據(jù)設置自適應顯示。
媒體查詢可用于檢測很多事情，例如：
viewport(視窗) 的寬度與高度
設備的寬度與高度
朝向 (智能手機的橫屏，豎屏)
分辨率
目前很多針對蘋果手機，Android 手機，平板等設備都會使用到多媒體查詢。
查詢語法
@media not|only mediatype and (expressions) {
CSS 代碼...;
}多媒體查詢由多種媒體組成，可以包含一個或多個表達式，表達式根據(jù)條件是否成立返回 true 或 false。
媒體類型
如果指定的多媒體類型匹配設備類型則查詢結(jié)果返回 true，文檔會在匹配的設備上顯示指定樣式效果。
除非使用了 not 或 only 操作符，否則所有的樣式會適應在所有設備上顯示效果。
| 值 | 描述 |
|---|---|
| all | 用于所有媒體設備 |
| 用于打印機 | |
| screen | 用于電腦屏幕，平板，智能手機等 |
| speech | 用于屏幕閱讀器 |
媒體功能
| 值 | 描述 |
|---|---|
| aspect-ratio | 定義輸出設備中的頁面可見區(qū)域?qū)挾扰c高度的比率 |
| color | 定義輸出設備每一組彩色原件的個數(shù)。如果不是彩色設備，則值等于0 |
| color-index | 定義在輸出設備的彩色查詢表中的條目數(shù)。如果沒有使用彩色查詢表，則值等于0 |
| device-aspect-ratio | 定義輸出設備的屏幕可見寬度與高度的比率。 |
| device-height | 定義輸出設備的屏幕可見高度。 |
| device-width | 定義輸出設備的屏幕可見寬度。 |
| height | 定義輸出設備中的頁面可見區(qū)域高度。 |
| max-aspect-ratio | 定義輸出設備的屏幕可見寬度與高度的最大比率。 |
| max-color | 定義輸出設備每一組彩色原件的最大個數(shù)。 |
| max-color-index | 定義在輸出設備的彩色查詢表中的最大條目數(shù)。 |
| max-device-aspect-ratio | 定義輸出設備的屏幕可見寬度與高度的最大比率。 |
| max-device-height | 定義輸出設備的屏幕可見的最大高度。 |
| max-device-width | 定義輸出設備的屏幕最大可見寬度。 |
| max-height | 定義輸出設備中的頁面最大可見區(qū)域高度。 |
| max-resolution | 定義設備的最大分辨率。 |
| max-width | 定義輸出設備中的頁面最大可見區(qū)域?qū)挾取?/td> |
| min-device-width | 定義輸出設備的屏幕最小可見寬度。 |
| min-device-height | 定義輸出設備的屏幕的最小可見高度。 |
| min-height | 定義輸出設備中的頁面最小可見區(qū)域高度。 |
| min-width | 定義輸出設備中的頁面最小可見區(qū)域?qū)挾取?/td> |
| orientation | 定義輸出設備中的頁面可見區(qū)域高度是否大于或等于寬度。 |
| resolution | 定義設備的分辨率。如：96dpi, 300dpi, 118dpcm |
| width | 定義輸出設備中的頁面可見區(qū)域?qū)挾取?/td> |
舉個例子
屏幕寬度大于480px，字體的大小設置為16px。
@media screen and (min-width: 480px) {
body {
font-size:16px;
}
}看完了這篇文章，相信你對“css3中媒體查詢的語法簡介”有了一定的了解，如果想了解更多相關知識，歡迎關注億速云行業(yè)資訊頻道，感謝各位的閱讀！
免責聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。
