您可以在 `@page` 规则中指定页面框的尺寸、方向、边距等。页面框的尺寸由 `size` 属性设置。页面区域的尺寸是页面框尺寸减去边距区域。例如，以下 `@page` 规则将页面框大小设置为 8.5 × 11 英寸，并在页面框边缘和页面区域之间创建 '2cm' 边距：     您可以在 `@page` 规则中使用 `margin`、`margin-top`、`margin-bottom`、`margin-left` 和 `margin-right` 属性来设置页面的边距。最后，... 阅读更多

LINK 元素的 `media` 属性指定外部样式表的目标媒体 - 示例    

要指定目标媒体，请使用 `media` 属性 - 示例    

LINK 元素的 `media` 属性指定外部样式表的目标媒体 - 示例    

以下是 CSS 中的媒体类型：序号 值 & 描述 1. all 适用于所有设备。 2. aural 用于语音合成器。 3. braille 用于盲文触觉反馈设备。 4. embossed 用于分页盲文打印机。 5. handheld 用于手持设备（通常是小型屏幕、单色、带宽有限）。 6. print 用于分页不透明材料和以打印预览模式在屏幕上查看的文档。请参阅关于分页媒体的部分。 7. projection 用于投影演示，例如投影仪或打印到透明胶片。请参阅关于分页媒体的部分。 8. screen 主要用于彩色电脑屏幕。 9. tty 用于使用固定间距字符网格的媒体，例如电传打字机、终端或显示能力有限的便携式设备。 10. tv 用于电视类型设备。 阅读更多

此属性指定说话声音的平均音高（频率）。语音的平均音高取决于语音系列。例如，标准男性语音的平均音高约为 120Hz，而女性语音的平均音高约为 210Hz。可能的值包括 - frequency - 以赫兹 (Hz) 指定说话声音的平均音高。x-low、low、medium、high、x-high - 这些值不会映射到绝对频率，因为这些值取决于语音系列。

cue-after 属性指定在朗读元素内容后播放的声音，以将其与其他内容区分开来。可能的值包括 - url - 要播放的音频文件的 URL。none - 不播放任何声音。示例    

要使用 CSS 在图像上实现淡出动画效果，您可以尝试运行以下代码 - 示例在线演示                    .animated {             background-image: url(/css/images/logo.png);             background-repeat: no-repeat;             background-position: left top;             padding-top:95px;             margin-bottom:60px;             -webkit-animation-duration: 10s;animation-duration: 10s;             -webkit-animation-fill-mode: both;animation-fill-mode: both;          }          @-webkit-keyframes fadeOut {             0% {opacity: 1;}             100% {opacity: 0;}          }          @keyframes fadeOut {             0% {opacity: 1;}             100% {opacity: 0;}          }          .fadeOut {             -webkit-animation-name: fadeOut;             animation-name: fadeOut;          }                           重新加载页面                function myFunction() {             location.reload();          }          

要使用 CSS 在图像上实现向上放大淡入动画效果，您可以尝试运行以下代码：示例在线演示                    .animated {             background-image: url(/css/images/logo.png);             background-repeat: no-repeat;             background-position: left top;             padding-top:95px;             margin-bottom:60px;             -webkit-animation-duration: 10s;             animation-duration: 10s;             -webkit-animation-fill-mode: both;             animation-fill-mode: both;          }          @-webkit-keyframes fadeInUpBig {             0% {             opacity: 0;             -webkit-transform: translateY(2000px);          }          100% {             opacity: 1;             -webkit-transform: translateY(0);          }       }       @keyframes fadeInUpBig {          0% {             opacity: 0;             transform: translateY(2000px);          }          100% {             opacity: 1;             transform: translateY(0);          }       }       .fadeInUpBig {          -webkit-animation-name: fadeInUpBig;          animation-name: fadeInUpBig;       }                         重新加载页面                function myFunction() {             location.reload();          }          

我们知道 CSS 为开发者提供了过多的功能。有些功能只能通过调整现有功能来实现，而另一些功能可以直接实现。例如，不同的动画可以应用于不同的网站元素。其中一种是淡入动画。当鼠标悬停在淡入动画中的对象上时，它似乎会变暗。存在多种方法可以实现此结果。为了吸引人们对某个按钮或图像的注意，我们使用此技术。我们可以通过调整元素的不透明度来实现这一点。示例让我们来看下面的例子，我们将…… 阅读更多