使用特性查询的基本网格布局和回退
阅读评论
我经常看到很多人问关于 CSS Grid 中的回退以及我们如何为不支持这些新奇技术的浏览器设计的问题。 但从现在开始,我将把他们发送到 HJ Chen 的这篇文章。 它深入研究了我们如何使用 @supports
以及我们如何确保我们的布局在任何浏览器中都不会崩溃。
来自网络的一些我们正在阅读并有一些想法的东西。 有我们应该知道的链接吗? 告诉我们!
我经常看到很多人问关于 CSS Grid 中的回退以及我们如何为不支持这些新奇技术的浏览器设计的问题。 但从现在开始,我将把他们发送到 HJ Chen 的这篇文章。 它深入研究了我们如何使用 @supports
以及我们如何确保我们的布局在任何浏览器中都不会崩溃。
Mandy Michael
如果你在工作中只做写 JS,那很棒,你很棒,就像所有写 CSS 或专注于特定领域的人一样,比如无障碍、SVG、动画等等。
我非常担心的是,许多人仍然没有看到在 CSS & HTML 中精通的价值。 我不明白这种态度。 我们所有人一起为我们的行业创造价值。
+1 在所有 Mandy 的观点上。
我怀疑随着设计趋势向更复杂的风格转变,HTML 和 CSS 技能的吸引力会回升。 更有趣的布局就是其中之一。 我倾向于发现那些只涉足 HTML/CSS 的开发人员在涉及布局的从头开始工作时会很快失败。 这里还有很多灰色地带。 例如,我写 Ruby 代码,但在遇到中等复杂的事情时,我很快就会失败。
我还怀疑这场对话的根源在于 HTML、CSS 和 JavaScript 如此交织在一起,看到其他人停留在前两个,有些人会感到不舒服。
这个小网站从 CNN 中提取所有主要故事,并从设计中剥离几乎所有内容; 样式、图像、字体、广告、颜色。 没有,零,消失。 乍一看,它看起来只是一些超文本,感觉是一个非凡的改进,但 Sam Saccone 开启了一条线程 关于该团队可以用来使体验更快的一些潜在改进,例如服务器端渲染以及用更小的东西(如 Preact)替换 React 框架。
无论哪种方式,这种新闻设计方法都是令人耳目一新的。 然而,除了 Twitter 上的公告,我无法找到关于构建此版本 CNN.com 的动机的更多信息。 当然,如果 CNN 特别为那些身处灾难性情况中的人构建了这个,而这些人的电池续航时间和加载时间可能是生死攸关的问题,那将非常令人着迷。
Tom Dale
越来越多的情况下,交付给浏览器的字节与 Web 开发人员编写的源代码越来越不像。
的确。 我 怀疑 也是这样。
因为性能非常重要,并且有很大的机会在性能方面变得聪明,所以我们将看到在将代码库交付到生产环境中方面的创新。 像 webpack(树摇动、代码拆分)这样的工具已经在这里做了很多,但还有很多空间让自动化工具在我们的代码最终交付到浏览器的方式上发挥神奇作用。
Tom 还说
这在某种程度上是一种损失(还有谁从 View Source 开始他们的 Web 开发?),但对用户来说是一个巨大的胜利,特别是在新兴市场。
在我看来,当今的 GitHub、StackOverflow 以及学习资源的激增,不仅仅弥补了通过我们自己的网站探索来学习的不足,更不用说当今的 DevTools 多么有洞察力,即使它们查看的不是手工编写的代码。
使用 Bugsnag 自动检测和诊断影响用户的 JavaScript 错误。 获取全面的诊断报告,立即了解哪些错误值得修复,并以比传统工具快得多的速度进行调试。