直接使用代码

图片素材

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

css代码

 <style>
.com-arctype-title h2{ line-height:35px;font-size:18px; text-align: center}
.com-arctype-title .line{width:150px;min-height:1px;border-bottom:3px solid #0689ca;margin: 20px auto}

.yjs-box2{min-height:350px;padding:10px;background:#fff; clear:both;}
.yjs-box2 h3{font-weight:bold;line-height:40px;font-size:16px}
.yjs-box2 ul{font-size:16px;margin:20px 30px;line-height: 30px;}

/* 电脑端专用 */
@media (min-width: 1200px) {
    .com-arctype-title h2{ line-height:35px;;font-size:30px}
    .com-arctype-title .line{width:150px;min-height:1px;border-bottom:3px solid #0689ca;margin: 20px auto}
    .yjs-box2{margin-right:15px;height:500px;padding:30px;background:#fff; clear:both;}
    .yjs-box2 h3{font-weight:bold;line-height:40px;font-size:22px}
  }

</style>

HTML+JS代码

 
<div class="container-fluid">
  <div class="col-md-3 col-xs-6 bg-green line50 text-center">美式教育英语授课</div>
  <div class="col-md-3 col-xs-6 bg-yellow line50 text-center">学习生活成本低廉</div>
  <div class="col-md-3 col-xs-6 bg-blue line50 text-center">回国享受海归政策</div>
  <div class="col-md-3 col-xs-6 bg-green line50 text-center">一带一路支持项目</div>
</div>
<div class='h30 hidden-xs'></div>

<section class="container-fluid bg-ef2 pad-y30">
  <div class="container">
    <div class="com-arctype-title">
      <h2>菲律宾的大学本科申请材料清单</h2>
      <div class="line"></div>
    </div>
    <div class="row">
      <div class='col-md-6 col-xs-12'>
        <div class='yjs-box2'>
          <img src="http://www.bootfastui.cn/img/2021/0328-2/checklist-1.png" class="center-block" />
          <h3 class="text-center">本科申请必须递交的资料</h3>
          <ul style="margin-bottom:0;">
            <li>★ 出生证明</li>
            <li>★ 无犯罪证明</li>
            <li>★ 高中（中专）毕业证</li>
            <li>★ 高中（中专）成绩单</li>

          </ul>
        </div>
      </div>
      <div class="clear visible-xs"><br /></div>
      <div class='col-md-6  col-xs-12'>
        <div class='yjs-box2 '>
          <img src="http://www.bootfastui.cn/img/2021/0328-2/checklist-2.png" class="center-block" />
          <h3 class="text-center">非必需的申请资料</h3>
          <ul style="margin-bottom:0;">

            <li>★ 家庭存款或资产证明</li>
            <li>★ 留学保证金</li>
            <li>★ 推荐信</li>
            <li>★ 雅思或托福成绩（一般学校不需要）</li>

          </ul>
        </div>
      </div>
    </div>
  </div>
</section>