圆角表格


综合名次	机构名称	远景与使命	管理与运营	课程与教学	招生与生源	学院服务与安全保障	硬件与设施	综合分数
	小明星艺术团-优胜北路	评审中	评审中	评审中	评审中	评审中	评审中	评审中
	汉堂书画	评审中	评审中	评审中	评审中	评审中	评审中	评审中
	伯爵音乐教育	评审中	评审中	评审中	评审中	评审中	评审中	评审中
	大嘴巴语言艺术部落黄河路	评审中	评审中	评审中	评审中	评审中	评审中	评审中

直接使用代码

图片素材

css代码

<style>
.tablelist{width:100%;clear:both;border-collapse:separate;border-spacing:0;border:1px #d4d8da;}
.tablelist th{background:#f9f9f9;height:50px;line-height:20px;border-top:solid 1px #b6cad2;text-indent:11px;color:#1fad9d;}
.tablelist td{line-height:40px;}
table tr th,table tr td{border-right:1px solid #d4d8da;border-bottom:1px solid #d4d8da;text-align:center;}
.tablelist tr th:first-child,table tr td:first-child{border-left:1px solid #d4d8da;}
.tablelist tr:first-child th:first-child{border-top-left-radius:12px;}
.tablelist tr:first-child th:last-child{border-top-right-radius:12px;}
.tablelist tr:last-child td:first-child{border-bottom-left-radius:12px;}
.tablelist tr:last-child td:last-child{border-bottom-right-radius:12px;}

</style>

HTML+JS代码

  
<div class="container">
  <br/>
  <table class="tablelist text-center">
    <tr class="h10">
      <th colspan="9" style="height:30px;"></th>

    </tr>
    <tr class="blue2">
      <th width='7%'>综合名次</th>
      <th width='23%'>机构名称</th>
      <th width='10%'>远景与使命</th>
      <th width='10%'>管理与运营</th>
      <th width='10%'>课程与教学</th>
      <th width='10%'>招生与生源</th>
      <th width='10%'>学院服务<br />与安全保障</th>
      <th width='10%'>硬件与设施</th>
      <th width='10%'>综合分数</th>
    </tr>
    <tr>
      <td>
        <img src="http://www.bootfastui.cn/img/2021/0415-2/org1.png" width="40" class="center-block" />
      </td>
      <td><a href=''>小明星艺术团-优胜北路</a></td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>

    </tr>
    <tr>
      <td>
        <img src="http://www.bootfastui.cn/img/2021/0415-2/org2.png" width="40" class="center-block" />
      </td>
      <td><a href=''>汉堂书画</a></td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>

    </tr>
    <tr>
      <td>
        <img src="http://www.bootfastui.cn/img/2021/0415-2/org3.png" width="40" class="center-block" />
      </td>
      <td><a href=''>伯爵音乐教育</a></td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>

    </tr>
    <tr>
      <td>
        <img src="http://www.bootfastui.cn/img/2021/0415-2/org4.png" width="40" class="center-block" />
      </td>
      <td><a href=''>大嘴巴语言艺术部落黄河路</a></td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>
      <td>
        评审中
      </td>

    </tr>
  </table>
</div>