html，完成下图列表中效果

img

li标签

<style>    li {
        border-bottom: dashed 1px #ccc;
        line-height: 30px;
        list-style: square
    }
</style>
<ul>
    <li>
        历届总决赛结果及总决赛MVP全记录
    </li>
    <li>
        历届NBA全明星赛结果及MVP得主
    </li>
    <li>
        历届NBA全明星扣篮赛冠车
    </li>
    <li>
        历届NBA全明星三分球大赛冠军
    </li>
    <li>
        历届NBA新秀状元一览
    </li>
</ul>



<!DOCTYPE html>
<html lang="en">
<head>
</head>
<style>
 .tierl{
    font-size: 20px;
    border-left: 10px solid red;
  }
  ul li{
    width: 300px;
    line-height: 35px;
    border-bottom: 1px dashed #e2e2e2;
  }
</style>
<body>
  <div>
    <div class="tierl">INBA历史资料</div>
    <ul>
      <li>历届总决赛结果及总决赛MVP全记录</li>
      <li>历届NBA全明星赛结果及MVP得主</li>
      <li>历届NBA全明星扣篮赛冠车</li>
      <li>历届NBA全明星三分球大赛冠军</li>
      <li>历届NBA新秀状元一览</li>
    </ul>
  </div>
</body>

img