我不知道如何正确使用CSS文件中的媒体选择器来确定要为iPhone或iPad加载的图像

Question

有几个html文件可以指导用户浏览我们的应用程序，并向用户介绍新功能。 它是iPhone和iPad的通用应用程序。 如果用户选择iPhone版本的帮助部分，我想向他显示针对iPhone设备缩放的图像。

但是现在有我的问题。 在CSS文件中，所有图像都只有一个class boximage。 如何确定要加载哪个图像？ 我应该把每个图像都放在自己的班上吗？

在此先感谢您的四个想法！

问候，北

Answer 1

你可以试试看

 <style type="text/css">
   @media all and (max-width: 800px) {
    .boximage{ background:url(image_name1.jpg)}
    }
    @media all and (min-width: 800px){ 
    .boximage{ background:url(image_name2.jpg)}
    }</style>

或使用javascript查找用户代理并通过脚本设置图像。