在bootstrap中实现竖屏切换图片代码是什么

Bootstrap并没有直接提供竖屏切换图片的内置功能，但是你可以通过CSS媒体查询（Media Queries）配合JavaScript（如jQuery）来实现这一效果。下面是一个简单的示例：

HTML部分：

<div class="img-container">
  <img src="image1.jpg" alt="Image 1" class="hidden-on-portrait">
  <img src="image2.jpg" alt="Image 2" class="visible-on-portrait">
</div>

CSS部分：

.hidden-on-portrait {
  display: none;
}

.visible-on-portrait {
  display: block;
}

/* 当屏幕宽度小于600px（比如常见的手机竖屏尺寸）时，显示第二个图像 */
@media (max-width: 600px) {
  .visible-on-portrait {
    display: none;
  }

  .hidden-on-portrait {
    display: block;
  }
}

JavaScript（jQuery）部分（如果需要响应窗口大小变化）：

$(window).resize(function() {
  if ($(window).width() < 600) {
    $('.img-container img').addClass('hidden-on-portrait').removeClass('visible-on-portrait');
  } else {
    $('.img-container img').removeClass('hidden-on-portrait').addClass('visible-on-portrait');
  }
});

这个例子假设在横屏状态下显示第一个图片，竖屏状态下显示第二个图片。初次加载页面后，会根据当前视口宽度自动调整图片显示状态。