八 CSS媒介型別

2021-09-01 13:50:09 字數 935 閱讀 1313

媒介型別

媒介型別(media types)允許你定義以何種媒介來提交文件。文件可以被顯示在顯示器、紙媒介或者聽覺瀏覽器等等。

媒介型別:某些 css 屬性僅僅被設計為針對某些媒介。

比方說 "voice-family" 屬性被設計為針對聽覺使用者終端。其他的屬性可被用於不同的媒介。

例如,"font-size" 屬性可被用於顯示器以及印刷媒介,但是也許會帶有不同的值。

顯示器上面的顯示的文件通常會需要比紙媒介文件更大的字型大小,

同時,在顯示器上,sans-serif 字型更易閱讀,而在紙媒介上,serif 字型更易閱讀。

@media規則

下面這個例子中的樣式告知瀏覽器在顯示器上顯示 14 畫素的 verdana 字型。

但是假如頁面需要被列印,將使用 10 個畫素的 times 字型。

注意:font-weight 被設定為粗體,不論顯示器還是紙媒介:

@media screen

}@media print

}@media screen,print

}不同的媒介型別

注釋:媒介型別名稱對大小寫不敏感。

媒介型別                        描述

all         用於所有的媒介裝置。

aural       用於語音和音訊合成器。

braille     用於盲人用點字法觸覺回饋裝置。

embossed    用於分頁的盲人用點字法印表機。

handheld    用於小的手持的裝置。

print       用於印表機。

projection  用於方案展示,比如幻燈片。

screen      用於電腦顯示器。

tty         用於使用固定密度字母柵格的媒介,比如電傳打字機和終端。

tv          用於電視機型別的裝置。

CSS 四十一 CSS2 媒介型別

媒介型別 media types 允許你定義以何種媒介來提交文件。文件可以被顯示在顯示器 紙媒介或者聽覺瀏覽器等等。某些 css 屬性僅僅被設計為針對某些媒介。比方說 voice family 屬性被設計為針對聽覺使用者終端。其他的屬性可被用於不同的媒介。例如,font size 屬性可被用於顯示器...

css 響應式(媒介查詢)

我們只需用到width衍生出的max width這個屬性,定義輸出裝置中的頁面可見區域寬度來控制該改變的樣式即可。html 如下 頭部 左部中部 右部 底部 demo01.css樣式如下 body header container clearfix after footer left center ...

CSS3 Media Query CSS3媒介查詢

通過min width的設定,我們可以在瀏覽器視窗或裝置螢幕寬度高於這個值的情況下,為頁面指定乙個特定的樣式表 max width則反之 如下面 有些時候,我們希望通過media queries作用於某種特定的裝置,而忽略其上執行的瀏覽器是否由於沒有最大化而在尺寸上與裝置螢幕尺寸產生不一致的情況。這...