环境光照水平 | @media.light-level (Media Queries) - CSS 中文开发手册 - Break易站

2021-01-27 11:14

阅读:721


  • ??CSS 中文开发手册

    环境光照水平 | @media.light-level (Media Queries) - CSS 中文开发手册

    @media.light-level

    非标准

    这个功能是非标准的,不在标准轨道上。不要在面向Web的生产站点上使用它:它不适用于每个用户。实现之间也可能存在大的不兼容性,并且行为在未来可能会改变。

    该light-level CSS @media媒体功能可用于应用基于环境光级别样式。

    语法

    dim该设备用于昏暗的环境,过度的对比度和亮度会使读者分心或不舒服。例如:夜间,或室内昏暗的环境

    。normal该设备用于屏幕理想范围内的光照水平的环境中,并且不需要任何特定的调整。

    washed该设备是在一个非常明亮的环境中使用,导致屏幕被渲光,难以阅读。例如:明亮的日光。

    例子

    此代码可能无法在任何设备上工作(设备兼容性较低)。

    @media (light-level: normal) {
      p { background: url("texture.jpg"); color: #333 }
    }
    
    @media (light-level: dim) {
      p { background: #222; color: #ccc }
    }
    
    @media (light-level: washed) {
      p { background: white; color: black; font-size: 2em; }
    }

    规范

    Specification

    Status

    Comment

    Media Queries Level 4The definition of ‘light-level‘ in that specification.

    Working Draft

    Deferred to Media Queries Level 5.

    浏览器兼容性

    Feature

    Chrome

    Firefox (Gecko)

    Internet Explorer

    Opera

    Safari

    Basic support

    No support

    No support

    No support

    No support

    No support

    Feature

    Android

    Firefox Mobile (Gecko)

    IE Mobile

    Opera Mobile

    Safari Mobile

    Basic support

    No support

    No support

    No support

    No support

    No support

    
    
  • ??CSS 中文开发手册

  • 评论


    亲,登录后才可以留言!