CSS ::媒体类型

样式表的最重要特征之一是它们指定如何在不同的媒体上呈现文档：在屏幕上，在纸上，在语音合成器上，在盲文设备上等等。

当前，我们有两种方法可以为样式表指定媒体依赖关系-

使用@media或@import规则从样式表中指定目标媒体。
在文档语言中指定目标介质。

@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	全部适用于所有设备。
2	听觉用于语音合成器。
3	盲文用于盲文触觉反馈设备。
4	浮雕旨在用于分页盲文打印机。
5	手持设备用于手持设备（通常是小屏幕，单色，带宽受限）。
6	打印用于分页，不透明的材料以及在打印预览模式下在屏幕上查看的文档。请查阅有关分页媒体的部分。
7	投影用于投影演示，例如投影仪或打印为透明胶片。请查阅有关分页媒体的部分。
8	屏幕主要用于彩色计算机屏幕。
9	tty适用于使用固定间距字符网格的媒体，例如电传打字机，终端或显示能力有限的便携式设备。
10	电视用于电视类型的设备。

基础教程