如何阻止img溢出？

阻止img溢出可以通过以下几种方式实现：

CSS样式控制：使用CSS的overflow属性来控制图片的溢出情况。可以设置overflow属性为hidden，这样当图片尺寸超过容器大小时，图片会被裁剪隐藏。例如：

.container {
  width: 200px;
  height: 200px;
  overflow: hidden;
}

.container img {
  width: 100%;
  height: auto;
}

JavaScript动态计算：使用JavaScript动态计算图片的尺寸，根据容器大小和图片比例来调整图片的宽高，以适应容器。可以通过监听窗口大小变化或者容器大小变化的事件来实时调整图片尺寸。

window.addEventListener('resize', function() {
  var container = document.querySelector('.container');
  var img = container.querySelector('img');
  var containerWidth = container.offsetWidth;
  var containerHeight = container.offsetHeight;
  var imgWidth = img.naturalWidth;
  var imgHeight = img.naturalHeight;
  var containerRatio = containerWidth / containerHeight;
  var imgRatio = imgWidth / imgHeight;

  if (containerRatio > imgRatio) {
    img.style.width = '100%';
    img.style.height = 'auto';
  } else {
    img.style.width = 'auto';
    img.style.height = '100%';
  }
});

腾讯云相关产品推荐：如果需要在腾讯云上部署图片存储和处理服务，可以使用腾讯云的对象存储（COS）和图片处理（CI）服务。腾讯云对象存储（COS）提供了高可靠、低成本的云端存储服务，可以存储和管理大量的图片资源。腾讯云图片处理（CI）服务可以对图片进行裁剪、缩放、旋转等处理，以适应不同的展示需求。您可以通过以下链接了解更多关于腾讯云对象存储和图片处理服务的信息：