<div class="wrap" >
  <div>蘋果</div>
  <div>香蕉</div>
  <div>柳丁</div>
</div>
.wrap{
  counter-reset: count;
}
.wrap div::before{
  counter-increment:count; 
  content:counter(count) '. ';
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.