我不知道如何正確使用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查找用戶代理並通過腳本設置圖像。