尝试使用bootstrap在大显示器上水平对齐项目，在小显示器上垂直对齐项目

在大显示器上水平对齐项目，在小显示器上垂直对齐项目，可以通过使用Bootstrap的栅格系统和CSS的媒体查询来实现。

首先，我们可以使用Bootstrap的栅格系统来实现在大显示器上水平对齐项目。栅格系统将页面水平划分为12个等宽的列，我们可以将项目放置在适当的列中以实现水平对齐。以下是一个示例代码：

<div class="container">
  <div class="row">
    <div class="col-lg-4">项目1</div>
    <div class="col-lg-4">项目2</div>
    <div class="col-lg-4">项目3</div>
  </div>
</div>

在上述代码中，我们使用了container类来创建一个容器，并在容器内部创建了一个行（row）。然后，我们使用col-lg-4类将每个项目放置在一个等宽的列中，这样它们就会在大显示器上水平对齐。

接下来，我们可以使用CSS的媒体查询来实现在小显示器上垂直对齐项目。媒体查询可以根据设备的屏幕尺寸应用不同的样式。以下是一个示例代码：

<style>
  @media (max-width: 767px) {
    .vertical-align {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
  }
</style>

<div class="container">
  <div class="row vertical-align">
    <div class="col-sm-4">项目1</div>
    <div class="col-sm-4">项目2</div>
    <div class="col-sm-4">项目3</div>
  </div>
</div>

在上述代码中，我们使用了媒体查询(max-width: 767px)来指定在小显示器上应用的样式。在这个样式中，我们使用了Flexbox布局来实现垂直对齐。通过设置display: flex，flex-direction: column和align-items: center，项目将在小显示器上垂直对齐。

推荐的腾讯云相关产品和产品介绍链接地址：