CSS - 媒體型別

樣式表最重要的功能之一是它們指定文件如何在不同的媒體上呈現：在螢幕上、在紙上、使用語音合成器、使用盲文裝置等。

目前，我們有兩種方法可以指定樣式表的媒體依賴性：

使用 @media 或 @import at-規則從樣式表中指定目標媒體。
在文件語言中指定目標媒體。

@media 規則

@media 規則指定了一組規則的目標媒體型別（用逗號分隔）。

下面是一個示例：

<style tyle = "text/css">
   <!--
      @media print {
         body { font-size: 10pt }
      }
	
      @media screen {
         body { font-size: 12pt }
      }
      @media screen, print {
         body { line-height: 1.2 }
      }
   -->
</style>

文件語言

在 HTML 4.0 中，LINK 元素上的 media 屬性指定了外部樣式表的目標媒體：

以下是一個示例：

<style tyle = "text/css">
   <!--
      <!doctype html public "-//w3c//dtd html 4.0//en">
      <html>
         <head>
            <title>link to a target medium</title>
            <link rel = "stylesheet" type = "text/css" media = "print, 
               handheld" href = "foo.css">
         </head>

         <body>
            <p>the body...
         </body>
      </html>
   -->
</style>

識別媒體型別

為 CSS 媒體型別選擇的名稱反映了相關屬性有意義的目標裝置。它們提供了一種瞭解媒體型別意在指代什麼裝置的感覺。下面列出了各種媒體型別：

序號	值和描述
1	all 適用於所有裝置。
2	aural 適用於語音合成器。
3	braille 適用於盲文觸覺反饋裝置。
4	embossed 適用於分頁盲文印表機。
5	handheld 適用於手持裝置（通常是螢幕小、單色、頻寬有限）。
6	print 適用於分頁、不透明材料以及在螢幕上以列印預覽模式檢視的文件。請參閱有關分頁媒體的部分。
7	projection 適用於投影演示，例如投影儀或列印到透明膠片。請參閱有關分頁媒體的部分。
8	screen 主要適用於彩色計算機螢幕。
9	tty 適用於使用固定間距字元網格的媒體，例如電傳打字機、終端或顯示能力有限的行動式裝置。
10	tv 適用於電視型別裝置。

注意 - 媒體型別名稱不區分大小寫。

列印頁面