<div>
  <ol>
    <li>番号つきのリストが入ります。番号つきのリストが入ります。番号つきのリストが入ります。</li>
    <li>番号つきのリストが入ります。</li>
    <li>番号つきのリストが入ります。番号つきのリストが入ります。番号つきのリストが入ります。</li>
    <li>番号つきのリストが入ります。</li>
    <li>番号つきのリストが入ります。番号つきのリストが入ります。番号つきのリストが入ります。</li>
  </ol>
</div>

div{
  max-width: 500px;
  padding: 50px;
  margin: 0 auto;
}
ol{
  /*要素の連番（カウンタ）の値をリセットする*/
  counter-reset: li;
}
li{
  position: relative;
  font-size: 20px;
  padding-left: 30px;
  margin: 0 0 10px;
  /*デフォルトのスタイルを非表示にする*/
  list-style: none;
}
li:before{
  position: absolute;
  top: 0;
  left: 0;
  font-weight: bold;
  color: #f00;
  /*要素の連番（カウンタ）の値を進める*/
  counter-increment: li;
  /*自動連番を付ける関数*/
  content: counter(li)'.';
}