直接使用代码

图片素材

点击下载本素材所包含的图片，js文件

css代码

 <style>
.top-banner {position: relative;}
.top-banner .banner-content{position: absolute; line-height:45px;top:80px;text-align:center; color:#fff; width:100%;padding:0 100px;}
</style>

HTML+JS代码

 <div class="container-fluid clear">
  <div class="top-banner ">
      <img src="http://www.bootfastui.cn/img/2021/0328/banner6.jpg" width="100%" />
      <div class="banner-content text-center hidden-xs" style="top:30px">
          <h2>菲律宾最受欢迎的大学</h2>
          <h4 class="line50">点击学校名称、直达菲律宾的大学具体介绍
          </h4>
      </div>
      <div class="banner-content text-center visible-xs" style="top:00px">
          <p>菲律宾最受欢迎的大学</p>
        
      </div>

  </div>
</div>