各个浏览器开启CSS Grid Layout的方式

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了各个浏览器开启CSS Grid Layout的方式相关的知识,希望对你有一定的参考价值。

2017年3月,Chrome、Firefox将开启默认支持。

当然对于很多人等不及浏览器默认支持,想提前体验一把,这里提供一些打开方式:

1、Chrome

在浏览器中输入:chrome://flags/#enable-experimental-web-platform-features

然后,对第一个实验性网络平台功能,点击启用

然后重启浏览器,然后便能体验到了。

2、Opera

在浏览器中输入:opera://flags/#enable-experimental-web-platform-features

然后,对第一个Enable experimental Web Platform features,点击启用

同样,重启浏览器

3、safari

在safari TP版本以及WebKit Nightly中可以使用。不过比较麻烦,需要OS10.12以上。

启用方式:Develop > Expermiental Features > CSS Grid

4、firefox

在浏览器中输入:about:config

然后,输入layout.css.grid,双击即可激活。

同样,重启浏览器


以上是关于各个浏览器开启CSS Grid Layout的方式的主要内容,如果未能解决你的问题,请参考以下文章

CSS grid layout demo 网格布局实例

使用 CSS Grid 实现表单布局的优势

CSS Grid Layout:如何使背景颜色跨越多个单元格?

grid-layout(网格布局)初探

Grid Layout

CSS网格布局(Grid)教程