在内容后添加一个点：counter（mycounter）

Question

我想在内容之后添加一个点：我的Ol中的计数器（mycounter）。

没有圆点的当前状态：

我想如何呈现它：

事情是当应用内容：counter（mycounter）时，文本会删除点。

css将解释大部分......

＆＃13;

＆＃13;

/*Circle with number on the article-page*/

.article .article-info ol {
  list-style:none;
  counter-reset:mycounter;
  padding:0;
}

.article .article-info ol li {
  position:relative; 
  padding:5px 0;
}

.article .article-info ol li:before {
  content:counter(mycounter); 
  counter-increment:mycounter;
  position:absolute;
  top:0;
  left:-30px;
  width:25px;
  line-height:20px;
  border-radius:50%;
  color:#B71A8B;
  text-align:center;
  margin-top:7px;
  font-weight:bold;
  font-size:1.2em
	margin-left:30px
}

.article .article-info ol li{
 	font-size: 16px;
  line-height: 1.5em;
  font-weight: 100;
  opacity:.8;
}

＆＃13;

＆＃13;

＆＃13;

所以我想以某种方式添加类似content:counter(mycounter, ".")的内容。

我知道list-style：none和那就是原因，但无论如何都可以在不删除list-style的情况下添加点：none;