有没有办法用CSS将长数字($100000000)分解成更可读的三元组($100000)?

我一定要找到一个很好的方法。任何CSS技术,即使有可能,也不会是跨浏览器的。

没有办法通过CSS实现,但您可以像这样扩展数字类型:

    Number.prototype.formatMoney = function(c, d, t){
    var n = this, c = isNaN(c = Math.abs(c)) ? 2 : c, d = d == undefined ? "," : d, t = t == undefined ? "." : t, s = n < 0 ? "-" : "", i = parseInt(n = Math.abs(+n || 0).toFixed(c)) + "", j = (j = i.length) > 3 ? j % 3 : 0;
       return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
    };

然后像这样使用它:

var count = 10000000;
count.formatMoney(2, '.', ' ')

span {
    display: block;
    -moz-column-gap:5px;
    -moz-column-width:24px;
    word-wrap:break-word;
}

<span>100000</span>
<span>1000000</span>
<span>10000000</span>
<span>100000000</span>

给我

100 000
100 000 0
100 000 00
100 000 000

唯一剩下的就是从右边开始分裂。现在正在试验 direction: rtl

如果您不愿意使用JavaScript来更改格式,您应该在呈现页面之前从服务器更改其格式。

尽管我也承认这不是很好 ...

使用jQuery框架,$(“#myElement”).text()只返回文本(而不是任何嵌套的html)。所以你可以这样做:

<p>$<span id="myElement"><span class="triad">1</span><span class="triad">000</span><span class="triad">000</span></p>

并应用一些填充或边距,使其更具可读性。

当你打电话时:

$("#myElement").text();

CSS:

.triad { padding-left: 5px; }

n1313, http://wiki.csswg.org/ideas/content-formatting ;) 这不是一个解决方案,只是一个想法

function largeNumberToReadableNumber(number){
  var str = Math.floor(amount)+""; //make the integer a string
  var sub = str.substring(str.length-3, str.length); //the last three characters
  newstr = " "+sub;
  var i = 1;
  while (sub.length >= 3){
    sub = str.substring(str.length-((i+1)*3),str.length-(i*3)); //next three characters
    newstr = sub + " " + newstr; //append the characters
    i+=1;
  }
  return newstr;
}

largeNumberToReadable(120312381124124); //will output " 120 312 381 124  124"

我相信这本书可以写得更好、更短,但它确实做到了。

我发现了这段javascript,如果您打算在客户端执行它,它可能会帮助您: http://homepage.mac.com/ruske/ruske/C2127905073/E844527267/Media/FormatInteger.js

没有CSS操纵字符串。Sry你必须用JS来做

让数字显示两次怎么样:一次用于显示,一次用于如下操作:

<span class="money" data-value="1000000">$ 1 000 000</span>

getAttribute('data-value') 从JS中获取值,并以任何方式格式化数字。

data-* attributes 是HTML5中的一个新特性,但几乎所有当前的浏览器都已经支持它(模块化) .dataset 属性,因此您必须使用 getAttribute() 在当前/旧浏览器中)。

我希望这是可能的CSS:(你不能 得到

首先想到的是使用 :after 和 :before 具有 content:" "
然后,您只需要在正确的数字周围动态添加标记并设置样式。