html – 如何在css中指定不同的图像,具体取决于用户在桌面或移动浏览器上的访问

我不知道如果你想要JS,我决定回答你的问题,如果你想要 CSS3,尝试这样：

HTML：

<img src="image.jpg"
     data-src-960px="image-960px.jpg"
     data-src-1260px="image-1260px.jpg"
     alt="">

CSS：

@media (min-device-width:320pX) {
        img[data-src-960px] {
            content: attr(data-src-960px,url);
        }
    }

    @media (min-device-width:960pX) {
        img[data-src-1260px] {
            content: attr(data-src-1260px,url);
        }
    }

jQuery版本：

$(document).ready(function() {

 function imageresize() {
 var contentwidth = $('#content').width();
 if ((contentwidth) < '960'){
 $('.imageclass').attr('src','image-960px.jpg');
 } else {
 $('.imageclass').attr('src','image-1260px.jpg');
 }
 }

 imageresize();//Activates when document first loads 

 $(window).bind("resize",function(){
 imageresize();
 });

 });