html - 如何仅在纵向 View 中确定小屏幕的图像宽度？

Question

我希望横幅在纵向 View 时显示超过大屏幕(桌面)宽度的 50% 和小屏幕(iphone)宽度的 100%。在横向 View 中时，它必须为 50%。

目前我有

.advert-img {
  width: 50%
  height: auto;
}
@media screen and (max-width: 380px) {
  .advert-img {
    width: 100%;
  }
}

我如何考虑 Retina 显示器？

Answer 1

要考虑视网膜显示，您可以使用以下 css

@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 
    /* Retina-specific stuff here */
}

来源:https://css-tricks.com/snippets/css/retina-display-media-query/

希望对你有帮助