环境光照水平 | @media.light-level (Media Queries) - CSS 中文开发手册 - Break易站
2021-01-27 11:14
环境光照水平 | @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 |
文章标题:环境光照水平 | @media.light-level (Media Queries) - CSS 中文开发手册 - Break易站
文章链接:http://soscw.com/essay/47727.html