HTML/CSS - 横向和纵​​向选项

Question

我有一个 html 页面和一个链接的 css 页面，它们在链接时可以完美地显示和打印（纵向）。

当我选择横向选项时，它的显示方式相同，但由于我设置的分页符和间距，它的打印效果很差。

我的问题是，是否可以为不同的页面方向设置不同的 css 页面？如果是这样，我是否应该将其他选项添加到 HTML/CSS 链接中？

Answer 1

您可以使用一个 css 文件，例如，您可以为每个设备和每个方向指定 css 类：像这样：

/* Portrait and Landscape */
@media only screen and (min-device-width: 320px) and (max-device-width:480px) and (-webkit-min-device-pixel-ratio: 2) {

 }

/* Portrait */
@media only screen and (min-device-width: 320px) and (max-device-width:480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
  }

/* Landscape */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
}