grid layout_我应该尝试使用IE版本的Grid Layout吗？回顾2018

最新推荐文章于 2024-09-12 23:58:52 发布

cundai5745

最新推荐文章于 2024-09-12 23:58:52 发布

阅读量110

点赞数

文章标签： java python 深度学习人工智能编程语言

原文链接：https://rachelandrew.co.uk/archives/2018/07/17/should-i-try-to-use-the-ie-version-of-grid-layout-revisited-for-2018/

版权

grid layout

In November 2016, I wrote an article in response to a question about Grid support in IE10 and 11. In that piece I wrote a quick rundown of what parts of the modern specification were supported in the older IE version. During a recent discussion onstage at An Event Apart, the issue of using the -ms prefixed version came up. As Jeremy Keith has documented his thoughts on that discussion, I thought I would post mine as a response to his post and also as an update to my previous article.

2016年11月，我写了一篇文章来回答有关IE10和11中的网格支持的问题。在那篇文章中，我简要介绍了较旧的IE版本支持现代规范的哪些部分。在An Event Apart的舞台上最近的讨论中，出现了使用-ms前缀版本的问题。杰里米·基思（Jeremy Keith）在讨论中记录了他的想法时，我认为我将发布我的文章作为对他的帖子的回应，同时也是我上一篇文章的更新。

是否应该专门为IE10和11创建后备版本？ (Should I create a fallback version specifically for IE10 and 11?)

It is possible to use the -ms prefixed version to create a fallback, although it misses some features of the modern specification. The question really is, is it worth you going to that trouble for a diminishing number of visitors, when you will also need to create a fallback version for browsers which do not have grid and are not IE10 and 11. That’s three versions you are creating and, as Jeremy points out, it makes far more sense to make one fallback for everyone.

可以使用-ms前缀版本创建后备，尽管它缺少现代规范的某些功能。问题的实质是，您是否值得为不断减少的访问者带来麻烦，当您还需要为没有网格并且不是IE10和11的浏览器创建一个后备版本时，这就是您要创建的三个版本。而且，正如杰里米（Jeremy）所指出的，为每个人都进行一次备用是更有意义的。

The only reason I would be considering using the -ms prefixed version at this point, would be in the following situation:

此时我将考虑使用-ms前缀版本的唯一原因是在以下情况下：

I need to do something which only grid can achieve.
And, the -ms prefixed version would be overwhelmingly better than a simpler fallback.
And, I have a large percentage of visitors in IE10/11.

我需要做一些只有网格才能实现的事情。
而且，以-ms为前缀的版本将比简单的后备版本具有压倒性的优势。
而且，我在IE10 / 11中的访问者比例很高。

If making your site look exactly the same in browsers which do not support grid as those which do support grid is that important, maybe don’t use Grid Layout. This is still a valid choice. That way you can use legacy techniques which work in modern browsers as well as legacy browsers. If you want to do something that can only be done with grid however, then you need to think about non-grid supporting browsers. This includes IE10 and 11.

如果使您的网站在不支持网格的浏览器中看起来与不支持网格的浏览器完全一样重要，那么也许不要使用Grid Layout 。这仍然是一个有效的选择。这样，您可以使用在现代浏览器以及旧版浏览器中都可以使用的旧版技术。如果您想做一些只能通过网格完成的工作，那么您需要考虑不支持网格的浏览器。这包括IE10和11。

In the majority of cases your float-based fallback will be just fine for all of the legacy browsers. If there was something that would be much better when using the -ms prefixed version, I wouldn’t try and do my whole layout in grid. I’d use my simple float-based legacy fallback, and in one or two places where it made sense, throw in some -ms prefixed grid to enhance the layout for IE10/11. Using the type of technique I describe in my article Pattern Library First makes that kind of component based approach much more straightforward.

在大多数情况下，对于所有旧版浏览器来说，基于浮动的后备广告就可以了。如果使用-ms前缀版本时有更好的选择，那么我不会尝试在网格中进行整个布局。我将使用简单的基于float的旧式后备广告，并在有意义的一两个地方放一些-ms前缀的网格，以增强IE10 / 11的布局。使用我在我的文章“ 模式库优先”中描述的技术类型，可以使这种基于组件的方法更加直接。

An approach of enhancing browsers based on their capabilities will tend to get you the best results, whether the CSS in question is Grid, CSS Shapes or anything else. If you can enhance your layout for IE10/11 with judicious and careful use of the prefixed version, and you have the time to do so, that’s great. However you still need that float-based fallback, so start with that first.

无论问题CSS是Grid，CSS Shapes还是其他任何形式，一种基于浏览器功能增强浏览器的方法都趋向于获得最佳效果。如果可以通过谨慎和谨慎地使用带前缀的版本来增强IE10 / 11的版式，并且您有时间这样做，那就太好了。但是，您仍然需要基于浮点的后备，因此请首先开始。

我应该将Autoprefixer与Grid一起使用吗？ (Should I use Autoprefixer with Grid?)

I would strongly suggest not.

我强烈建议不要。

To use Grid Layout with Autoprefixer means remembering which bits of the spec you can’t use and limiting your use of the spec. Then carefully testing to make sure Autoprefixer hasn’t blown up your layout in Internet Explorer because you accidentally used one of those bits. You are adding complexity and testing requirements, not taking them away, no matter how attractive being able to run something that promises to sort it all out for you might be. As the prefixed spec is so different, you can’t fix compatibility with an automated tool, this isn’t just prefixes. So you still have to remember a pile of stuff, in this case all of the things you can no longer use in order to use Autoprefixer. Does it really make sense, to take a spec which is implemented pretty much in entirety across modern browsers, and limit your use of it due to the fact that a particular old browser exists?

要将Grid Layout与Autoprefixer一起使用，意味着记住您不可以使用规范的哪些位，并限制对规范的使用。然后仔细测试，以确保Autoprefixer不会在Internet Explorer中破坏布局，因为您不小心使用了其中之一。 您正在添加复杂性和测试需求 ，而不是消除它们，无论能够运行承诺将其全部解决的东西有多么诱人。由于带前缀的规范是如此不同，您不能解决与自动化工具的兼容性，而不仅仅是前缀。因此，您仍然必须记住一堆东西，在这种情况下，为了使用Autoprefixer，您将不再使用所有东西。采取一个在现代浏览器中几乎完全实现的规范，并由于存在特定的旧浏览器而限制使用它，真的有意义吗？

If using Grid in IE is so important to you, learn how Grid works in IE, and create fallback layouts with that spec, rather than hobbling your use of Grid in order to run Autoprefixer. However, with every month that passes, making special versions for two types of old browser makes less and less sense. Personally, I’d spend that time making my site more usable, accessible or beautiful for the majority of my users.

如果在IE中使用Grid对您如此重要，请了解Grid在IE中的工作原理，并使用该规范创建后备布局，而不是为了使用Autoprefixer而使您无法使用Grid。但是，随着时间的流逝，为两种类型的旧浏览器制作特殊版本的意义越来越小。就个人而言，我会花时间让我的网站对大多数用户而言更加实用，易于访问或美观。

As Jeremy notes, the usefulness of a tool like Autoprefixer is diminishing, which is a good thing. It is becoming far easier to code in a way that supports all browsers, where support means usable in an appropriate way for the technology the user has in front of them. Embrace that, and be glad for the fact that we can reduce complexity based on the increasing interoperability of CSS in our browsers.

正如Jeremy所指出的，像Autoprefixer这样的工具的实用性正在下降，这是一件好事。以支持所有浏览器的方式进行编码变得越来越容易，在这种方式下，支持意味着可以以适当的方式用于用户面前的技术。对此表示欢迎，并为我们可以基于浏览器中CSS互操作性的增强而降低复杂性这一事实感到高兴。