我正在创建一个响应式设计网页，我想确保我针对不同的设备和方向正确执行所有媒体查询。
这篇文章建议尝试使用最小宽度和最小高度媒体查询。并为不同的分辨率设置不同的断点。
采用流畅设计的多片机屏幕方向
虽然，我发现了这种方法的方向(见下文(。 我应该使用这种方法还是上述方法？ 我应该使用@media屏幕，还是应该考虑所有屏幕与屏幕？
@media screen and (min-width: 700px) and (orientation: landscape) { ... }
屏幕方向是一个有趣的问题，因为它并不总是由设备/浏览器报告回来的东西，因此使用起来不如最小宽度/最大宽度可靠。
另一件事是，除非你试图在设备处于横向时做一件特别时髦的事情，否则仅根据宽度断点调整设计通常就足以获得您想要的效果。
如果您有横向设备，那么让设计像在纵向上一样显示相同的水平空间可能是可以的。也就是说，对于用户来说，这不会是意外的行为。
至于媒体all与screen，我通常只坚持使用屏幕，因为用户想要做一些事情，比如打印页面，我不一定希望我的断点干扰这一点。
但是，与任何事情一样，您应该考虑用户最常见的用例，并据此做出决定。如果它只是一个普通的 Web 应用程序/页面，那么只使用screen而不用担心orientation根本没有错。