javascript - 在 CSS li 中只选择没有数字的文本

Question

如何修改现有的 CSS 代码以仅选择文本而不是连同数字一起复制。

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>   

当前

想要的

Answer 1

添加 -webkit-user-select: none;

到你的 .snippet-wrap .snippet-num li:before CSS 这样:

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

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

阅读更多有关 user-select 的信息以保持浏览器兼容性: https://developer.mozilla.org/en-US/docs/Web/CSS/user-select