grid布局浏览器兼容_CSS Grid布局教程之浏览器开启CSS Grid Layout汇总

上一篇《CSS Grid布局教程之什么是网格布局》中简单介绍了什么是CSS Grid Layout以及一些概念和术语，为后续学习和使用CSS Grid Layout做了一些铺垫。但浏览器对CSS Grid Layout到目前为止各浏览器厂端支持程度不一致，致使无法全面使用，就算是学习做一些测试示例都还需要做一些设置。那么在这篇文章中，将向大家介绍如何让自己的浏览器支持CSS Grid Layout模块功能。

浏览器兼容性

先来回忆一下几大主流浏览器对CSS Grid Layout模块的支持达到什么样的程度：

从上图不做过多阐述，可以说是一目了然，不过值得欣慰的是，一直不给力的IE，这回却给力了一回，从IE10版本就默认开启了CSS Grid Layout的模块功能。

开启浏览器的CSS Grid Layout模块功能

到目前几大主流浏览器主要包括：

Chrome Safari Internet Explorer Opera Firefox

当然，喜欢追求新东西的同学，还会观注：

Chrome CanaryWebkit NightlyOpera NextFirefox Aurora

除了IE10+默认支持CSS Grid Layout模块功能之外，其他的浏览器Chrome、Safari、Opera和Firefox都需要重新设置(启用开发中的实验性网络平台功能)。

Chrome浏览器

在写这篇文章的时候，我使用的Chrome浏览器版本是“Chrome 38.0.2125.101”。在Chrome浏览器中开启CSS Grid Layout模块功能比较简单，只需要在您的浏览器地址栏中输入：chrome://flags，回车后在列表清单中找到“