<button class="poster_video" id="play_button"> <div class="poster_videoSjx"> </div> </button> 在这个代码中间用bootstrap做一个弹窗视频 有关闭按钮 按钮用图片做背景

可以使用 Bootstrap 的模态框（Modal）组件来实现弹窗视频效果，具体步骤如下：

1. 在 HTML 文件中引入 Bootstrap 的 CSS 和 JavaScript 文件：

<!-- 引入 Bootstrap 的 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.6.0/css/bootstrap.min.css">
<!-- 引入 Bootstrap 的 JavaScript 文件 -->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/popper.js/2.9.3/umd/popper.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js"></script>

2. 编写 HTML 代码：

<!-- 视频播放按钮 -->
<button class="poster_video" id="play_button">
  <div class="poster_videoSjx"></div>
</button>

<!-- 模态框 -->
<div class="modal fade" id="videoModal" tabindex="-1" role="dialog" aria-labelledby="videoModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="videoModalLabel">视频标题</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="关闭">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <video src="视频地址" controls></video>
      </div>
    </div>
  </div>
</div>

3. 添加 JavaScript 代码：

$(function () {
  // 点击视频播放按钮，弹出模态框
  $('#play_button').on('click', function () {
    $('#videoModal').modal('show');
  });
});

在上面的代码中，我们使用了 Bootstrap 的模态框组件，并且通过 JavaScript 代码来实现了点击视频播放按钮后弹出模态框的效果。视频播放器使用了 HTML5 的 video 标签，可以通过设置 src 属性来指定视频的地址。关闭按钮则使用了 Bootstrap 的关闭按钮组件，可以通过 data-dismiss 属性来指定关闭模态框的操作。至于按钮用图片做背景，可以在 CSS 文件中设置相应的样式即可。