col-sm-auto 和 row-cols-md-auto具体如何使用，请给出示例？比如请输入账号+输入框，另一行显示请输入密码+输入框

在Bootstrap 5中，你可以使用`col-sm-auto`和`row-cols-md-auto`结合网格系统（Grid System）来创建自适应的表单布局。这两个类主要用于在不同屏幕尺寸上分配列的宽度，使得内容在小屏幕上保持紧凑，在大屏幕上更易读。

下面是一个简单的例子，展示如何在两行创建一个登录表单，每行包含一个输入框：

<div class="container">
  <div class="row justify-content-between">
    <!-- 第一行 -->
    <div class="col-sm-auto">
      <label for="usernameInput">账号:</label>
      <input type="text" id="usernameInput" class="form-control me-2" placeholder="请输入您的账号...">
    </div>
    <div class="col-sm-auto">
      <label for="passwordInput">密码:</label>
      <input type="password" id="passwordInput" class="form-control" placeholder="请输入您的密码...">
    </div>
  </div>

  <div class="row justify-content-between mt-3"> <!-- 间隔行 -->
    <!-- 第二行 -->
    <div class="col-sm-auto">
      <!-- 这里可以添加“记住我”复选框、登录按钮等 -->
    </div>
  </div>
</div>

在上面的例子中，`col-sm-auto`会在小屏幕设备（如手机）上将每个输入框宽度限制到当前列的一半，而在平板电脑及以上的大屏幕设备（md以上）上会自动填充剩余的空间。