順位付けの箇条書きのCSS生成

<style type="text/css">
.Rankstyle {
  counter-reset:ctr-ranking;           /* カウンターをリセット */
  text-align:left;                     /* 左寄せ */
  font-size: 18px;                     /* フォントサイズ */
  margin-left:20px;                    /* 左の余白高さ */
}
.Rankstyle li  {
  position   : relative;               /* 指定した分だけ相対的に移動 */
  line-height: 2;                      /* 行の高さ */
}
.Rankstyle li:nth-child(1):before {
  position: absolute;                  /* 親要素を基準 */
  top: 0;                              /* 上限より表示 */
  left: -35px;                         /* 箇条書きリストの左側に表示 */
  content:"";                          /* content 追加 */
  width: 0;                            /* 幅ゼロ */
  height: 0;                           /* 高さゼロ */
  border-left: 15px solid transparent;  /* 以下３行の */
  border-right: 15px solid transparent; /* borderの指定で */
  border-bottom: 30px solid #7f7f00;   /* 三角形を作成 */
}
.Rankstyle li:nth-child(1):after {
  position: absolute;                  /* 親要素を基準 */
  top: 0;                              /* 上限より表示 */
  left: -35px;                         /* 箇条書きリストの左側に表示 */
  content: counter(ctr-ranking, decimal); /* カウンタ追加 */
  counter-increment: ctr-ranking; /* カウンタの増分指定 */
  color: #000;                         /* 文字の色の指定 */
  font-size: 11px;                     /* 文字サイズの指定 */
  padding: 1px 0px;                    /* 余白の指定 */
  line-height: 0.6;                    /* 文字の表示位置調整 */
  width: 0;                            /* 幅ゼロ */
  height: 0;                           /* 高さゼロ */
  border: 15px solid #7f7f00;          /* 以下２行のbordeの指定で */
  border-top: 15px solid transparent;  /* 山型を作成 */
}
.Rankstyle li:nth-child(2):before {
  position: absolute;                  /* 親要素を基準 */
  top: 0;                              /* 上限より表示 */
  left: -35px;                         /* 箇条書きリストの左側に表示 */
  background: #7f4600;                 /* マークの色 */
  content: counter(ctr-ranking, decimal); /* カウンタ追加 */
  counter-increment: ctr-ranking;      /* カウンタの増分指定 */
  color: #000;                         /* 文字の色の指定 */
  font-size: 10px;                     /* 文字サイズの指定 */
  padding: 5px 10px;                   /* 余白の指定 */
  border-radius: 50%;                  /* 角丸を指定 */
}
.Rankstyle li:nth-child(3):before {
  position: absolute;                  /* 親要素を基準 */
  top: 0;                              /* 上限より表示 */
  left: -35px;                         /* 箇条書きリストの左側に表示 */
  background: #999999;                 /* マークの色 */
  content: counter(ctr-ranking, decimal); /* カウンタ追加 */
  counter-increment: ctr-ranking;      /* カウンタの増分指定 */
  color: #000;                         /* 文字の色の指定 */
  font-size: 10px;                     /* 文字サイズの指定 */
  padding: 5px 10px;                   /* 余白の指定 */
}
</style>