css和jQuery ，字符串中重新定义单个字符样式背景

 <table class="tb2">

 <tr><td class="td1">融资登记企业<span>985</span>个</td><td class="td2">融资项目数量<span>985</span>个</td><td class="td3">融资需求金额<span>985</span>万元</td></tr>

  <tr><td>完成融资企业<span>00008</span>个</td><td>完成融资数量<span>985</span>个</td><td>完成融资金额<span>985</span>万元</td></tr>

 </table>

背景图


.tb2 td span i{background:url(../images/numbg.png) no-repeat 0px 0;

display:inline-block;
font-size:20px;color:#ff0000;font-weight:bold;font-family:Arial;line-height:30px;display:inline-block;height:28px;width:27px;text-align:center;font-style:normal}

  $(".tb2 td span").each(function () {//遍历每个span元素

         var str = $(this).text();

         var arr = str.match(/./g); //将元素中的单个字符组成数组

         var str2 = "";

         for (var i = ; i < arr.length; i++) {

             str2 += arr[i].replace(arr[i], "<i>" + arr[i] + "<\/i>"); //将数组元素替换，并且带有i标签

         }

         $(this).html(str2); //对当前元素进行新的赋值，例如将数字985替换为<i>9</i><i>8</i><i>5</i>的格式

     });

最终效果

css和jQuery ，字符串中重新定义单个字符样式背景

如果用背景平铺和letter-spacing，是达不到这种效果的，数字的前面和后面部分都会有一小段出现