Bootstrap/CSS:让我的内容在滚动的标题下面

<div class="container">
  <h1 class="scrolling-title">滚动的标题</h1>
  <div class="content">
    <!-- 内容 -->
  </div>
</div>

<style>
  .scrolling-title {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #f8f9fa;
    padding: 10px;
    z-index: 9999;
  }

  .content {
    margin-top: 50px; /* 根据标题高度调整内容的上边距 */
  }
</style>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
  $(document).ready(function() {
    $(window).scroll(function() {
      var scroll = $(window).scrollTop();
      if (scroll > 0) {
        $('.scrolling-title').addClass('scrolled');
      } else {
        $('.scrolling-title').removeClass('scrolled');
      }
    });
  });
</script>