添加到资源后，图像质量变差

Question

默认情况下，图像质量很好，但是当我将其加载到资源时质量变得模糊。为什么会发生这种情况以及如何解决它？

原始图像的例子以及它在页面上的外观

// S L I D E R - S I N G L E
function setCurrent (first){
$('.current').html(first);
}
// set images to preview and remove big images
$('.description-single').find('img').each(function(){  
  var photoSrc  = $(this).attr('src'),
      photoImg  = '<img src="' + photoSrc + '">';
  $('.all-photos').append('<div class="photo-template">' + photoImg + '</div>');
  $(this).remove();
}); // end each
// set first image preview to current box 
var firstPhoto = $('.all-photos').find('div.photo-template:first').html()
setCurrent(firstPhoto);
// click handler
$('div.photo-template').on('click', function(){
  var selected = $(this).html();
  setCurrent(selected);
});
if($('.all-photos .photo-template img').length < 2) {
  $('.all-photos').hide();
}

直播示例http://beardhouse.com.ua/detskie-divany/mishutka

Answer 1

好的，这是一个问题，CSS中的img标签的bootstrap如何有一个max-width：100％;容器盒比图像小，因此缩小尺寸并降低质量。

看看CSS看起来像.current上的填充正在弄乱实际图像的大小。