在CSS li中仅选择没有数字的文本

Question

How modify this existing CSS code to select only text instead copying along with numbers.

CSS

.snippet-wrap {position:relative; width:640px;}
.snippet-wrap li { text-shadow:none;}
.snippet-wrap .snippet-num {list-style:none;counter-reset:paragraph;}
.snippet-wrap .snippet-num li {color:#333;border-left:1px solid #BDC3C7;margin-left:22px;} 
.snippet-wrap .snippet-num li:before {color:#999;margin-left:-24px;margin-right:10px; counter-increment:paragraph;  content:counter(paragraph);
    display:inline-block; text-align:right; width:20px;}

HTML

<ol class="snippet-num">
<li><span>Vegetables</span></li> 
<li><span>Soya</span></li> 
<li><span>Wheat Grass</span></li> 
<li><span>Cheque</span></li> 
</ol>   

Current

Desired

Answer 1

add -webkit-user-select: none;

to your .snippet-wrap .snippet-num li:before CSS such that:

.snippet-wrap .snippet-num li:before {
  -webkit-user-select: none;

  /* rest of your CSS properties */ 
  ....
}

read more about user-select to maintain browser compatibility: https://developer.mozilla.org/en-US/docs/Web/CSS/user-select