使用Flexible Box Layout创建通用HTML5 / CSS3网页

时间:2013-04-23 15:53:57

标签: html html5 css3 layout webkit

最近,我一直在阅读一些HTML5 / CSS3教程。在其中一个教程中,他介绍了Flexible Box模型。要使用它的功能,我们输入display:-webkit-box; -webkit-box-pack:center; -webkit-box-flex:1 我的问题是我只能在Chrome中使用它,但我想在IE和Firefox中编写一个使用此功能的通用HTML5 / CSS3代码以及其他(阴影,渐变)。

我试着在网上查找,但无法得到满意的解决方案。

有人可以提出任何建议。

谢谢。

2 个答案:

答案 0 :(得分:1)

尚未在所有浏览器中支持Flexbox。您可以将Flexie用作临时解决方案:http://flexiejs.com/。 Flexie使用Flexbox的旧(2009)语法。

您可以在此处看到对flexbox的浏览器支持:http://caniuse.com/flexbox

答案 1 :(得分:1)

  

我的问题是我只能在Chrome中使用它

Safari!吉兹。

IE显然从版本10开始有-ms-box,Firefox支持display: -moz-box,但MDN文章提到预计flexbox规范会被其他内容替换。

我认为早期的浏览器版本没有任何等价物。

这是一篇关于它的老Mozilla hacks文章:

这是我可以使用的页面:

总的来说,flexbox似乎对于日常使用来说是一个小问题。