请教关于bootstrop插入图片在移动端清晰问题。

Question

使用bootstrop巨幕放图片也使用了img-responsive图片响应式，在pc端看比较清晰但是放到在移动端缩小后特别不清楚，有没有什么好的方法？谢谢。

 <div class="jumbotron" id="ditu">
      <img class="img-responsive" src="images/contact us.jpg">
  </div>
#ditu{ background-image:url(images/contact us.jpg);}
   }

Answer 1

这种情况下只能改图，把地址信息拿出来，放到下面直接用文字显示，然后地图裁剪成大约2:1的大小，“住邦2000”字体放大。另外移动端要用2倍分辨率的图片以支持视网膜屏幕。

切换大小屏的方法是visible-xs-block和hidden-xs这两个class，给大图加上hidden-xs，给小图和文字加上visible-xs-block。这样在手机上看到的就是小图+文字，在电脑上看到的就是大图。