当屏幕尺寸减小(宽度)时，如何让flex容器一行显示div？

当屏幕尺寸减小（宽度）时，可以通过使用媒体查询和CSS Flexbox布局来实现让flex容器一行显示div。

媒体查询是一种CSS技术，可以根据设备的特性（如屏幕尺寸）来应用不同的样式。通过媒体查询，我们可以检测屏幕宽度是否小于某个阈值，并在满足条件时应用相应的样式。

Flexbox是一种CSS布局模型，可以方便地创建灵活的、响应式的布局。通过设置flex容器的属性，我们可以控制flex子项在容器内的排列方式。

下面是一个示例代码，展示如何使用媒体查询和Flexbox来实现当屏幕尺寸减小时，让flex容器一行显示div：

<!DOCTYPE html>
<html>
<head>
  <style>
    .flex-container {
      display: flex;
      flex-wrap: wrap;
    }
    
    .flex-item {
      flex: 1 0 200px;
      margin: 10px;
      background-color: #f2f2f2;
      text-align: center;
      padding: 20px;
    }
    
    @media (max-width: 600px) {
      .flex-item {
        flex-basis: 100%;
      }
    }
  </style>
</head>
<body>
  <div class="flex-container">
    <div class="flex-item">Div 1</div>
    <div class="flex-item">Div 2</div>
    <div class="flex-item">Div 3</div>
    <div class="flex-item">Div 4</div>
  </div>
</body>
</html>

在上述代码中，我们创建了一个flex容器（.flex-container），并将其子项（.flex-item）设置为具有相同的宽度（flex: 1 0 200px;）。这样，当屏幕宽度足够大时，子项会一行显示。

然后，我们使用媒体查询（@media (max-width: 600px)）来检测屏幕宽度是否小于600px。如果满足条件，我们将子项的基础宽度（flex-basis）设置为100%，这样子项将会在一行显示。

这是一个简单的示例，你可以根据实际需求进行调整和扩展。腾讯云提供了丰富的云计算产品，如云服务器、云数据库、云存储等，可以根据具体场景选择适合的产品。你可以访问腾讯云官网（https://cloud.tencent.com/）了解更多产品信息和文档。