这里的工作方式是在我的块中

mdruhul13

使用 div 宽度显示。我们实际上有三个这样的 div，彼此相邻，它们的宽度都是 33%。他们会安排三个人可以坐在一起。它们的最小宽度均为 140 像素，因此，如果不再有足够的空间来容纳所有这三个元素（因为它们位于显示内联块中），它们自然会匹配甚至彼此相邻的 CSS 流。这是让它像这样工作的一个很好的方法。

雷米·帕门蒂埃：我还在这里使用 CSS 和媒体查询，让您在此处拥有内容时变得更加优雅。如果我在这里禁用样式，如果我删除所有这些，您可以看到布局发生了一些变化。我们仍然有两列，但它们更加粘在一起。即使没有任何样式，仅使用 div 显示和行块，布局仍然可以正常工作，我们可以从三到二到一布局。

雷米·帕门蒂埃：然后，也许让电子邮件在移动设备上运行的最后一种、最流行 阿联酋电话号码列表 的方法是让它们移动优先，对它们进行移动优先编码。我将再次回到同一封电子邮件。你可以在这里看到……哎呀，这不合适。我将这两列电子邮件列放在一起。如果我将窗口大小调整得小一点，它们就会相互堆叠。

雷米·帕门蒂埃：现在，因为这是移动优先编码的，这意味着这实际上是此缩放的默认布局。在它们上，我使用最小宽度媒体查询来更改桌面上的布局，在较大的窗口尺寸上以使其工作。如果我删除此处的所有样式，就像以前一样，您可以看到现在我们的图像彼此堆叠，就像在移动设备上一样。这就是您在编写移动优先代码时会得到的结果。您获得的大部分是移动视图，但在桌面上更大。当您为移动设备和每个电子邮件客户端编写电子邮件时，确实需要考虑很多因素。

雷米·帕门蒂埃：对我来说就差不多了。所有这些建议、所有指南，您都可以在 GitHub 上在线找到它们，我在那里提供了这些文档。我真的强烈鼓励您与同事分享并为此做出贡献。



雷米·帕门蒂埃：如果您认为您有好的建议可以适用于您将编写的每封电子邮件，请随时与我分享，也请随时为本文档做出贡献。希望您会有一些问题。您可以在 Twitter 或我的博客上找到我，如果您在本次会议后有任何疑问，也可以给我发送电子邮件。谢谢。

斯科特：非常感谢你，雷米。“再我的。” 那真是太好了。我有很多关于……哦，嘿，维塔利的问题。

维塔利：你好。你好，雷米。我很抱歉迟到了。大家好，亲爱的Smashing会员。我遇到了火车晚点之类的情况。斯科特，你想说点什么吗？抱歉我打扰了你。

斯科特：不。我只有两个问题要回避。其中一位来自 Pawan，他是 Smashing 会员中非常非常活跃的成员。