首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

网格 | @media.grid

@media.grid

grid CSS @media媒体功能可用于应用基于输出设备是否使用基于位图的基于网格或屏幕的风格。

语法

grid特征被指定为表示输出设备是否基于网格的<mq-boolean>值(01)。

例子

HTML

代码语言:javascript
复制
<p class="unknown">I don't know if you're using a grid device. :-(</p>
<p class="bitmap">You are using a bitmap device.</p>
<p class="grid">You are using a grid device! Neato!</p>

CSS

代码语言:javascript
复制
:not(.unknown) {
? color: lightgray;
}

@media (grid: 0) {
  .unknown {
?   color: lightgray;
? }

? .bitmap {
?   color: red;
  }
}

@media (grid: 1) {
? .unknown {
?   color: lightgray;
? }

? .grid {
?   color: red;
? }
}

结果

规范

Specification

Status

Comment

Media Queries Level 4The definition of 'grid' in that specification.

Working Draft

No change.

Media QueriesThe definition of 'grid' in that specification.

Recommendation

Initial definition.

浏览器兼容性

Feature

Chrome

Firefox (Gecko)

Internet Explorer

Opera

Safari

Basic support

(Yes)

(Yes)

?

(Yes)

(Yes)

Feature

Android

Firefox Mobile (Gecko)

IE Mobile

Opera Mobile

Safari Mobile

Basic support

?

?

?

?

?

扫码关注腾讯云开发者

领取腾讯云代金券

http://www.vxiaotou.com