水水水。。。。。

117 阅读1分钟

非常抱歉,您是对的。在 HTML 中,id 必须是唯一的,不能重复使用。

为了让这两个按钮居中而其他元素不动,您可以使用以下 CSS 样式:

css复制代码
.layui-col-md6 {
  text-align: center;
}

.centered-button-container {
  display: flex;
  justify-content: center;
}

.centered-button-container button {
  margin: 10px;
}

在 HTML 中,将按钮包装在一个具有特定类名(例如 centered-button-container)的容器 <div> 中:

html复制代码
<div class="layui-row layui-col-space5">
  <div class="layui-col-md6" style="text-align: center;">
    <div id="qrbDiv" style="height: 200px;width: 100%"></div>
    <div style="margin-top: 5px" class="layui-progress layui-progress-big" lay-showPercent="true" lay-filter="jdt-filter">
      <label style="margin-left: 45%">确认表导出进度</label>
      <div class="layui-progress-bar" lay-percent="0%"></div>
    </div>
    <div class="centered-button-container">
      <button type="button" data-fn="genQrb" class="layui-btn">生成确认表</button>
      <button type="button" data-fn="genSyQrb" class="layui-btn">生成剩余确认表</button>
    </div>
  </div>
</div>

在上述代码中,我们将按钮放置在一个具有类名 centered-button-container<div> 容器中。然后,通过设置该容器的 display: flex; justify-content: center; 样式,将按钮在水平方向上居中对齐。

请注意,在这种情况下,您不需要为按钮设置任何特定的 id。只需使用容器的类名来选择并样式化按钮即可。

希望这可以满足您的需求。如果您有任何其他问题,请随时提问。