有没有办法使用CSS将较长的数字（“$ 100000000”）分成更易读的三元组（“$ 100 000 000”）？
我有一个有很多大数值的页面。 数百万和数十亿美元无处不在。 而且很难读懂这些数字，所以我的客户要求我把它们分成三个符号，“$ 100000000”=>“$ 1亿”。
这是完全合理的要求，但问题是，我不想在服务器端做到这一点，我不想用JavaScript做到这一点。 你看，我已经有一大堆javascript已经在这个页面上运行，对这些长数字进行复杂的计算，并且在从页面读取数据的每个位置插入一个parseReadableStringToInteger() ，并且将一个writeIntegerAsReadableString()在每个把结果写回页面的地方。
所以，我正在考虑使用CSS将长string显示为一组短的块。 我的第一个想法是-moz-column和-webkit-column ，但不幸的是，他们只能使用已经被空格分开的单词。
也许有另一种方式？ 任何build议，欢迎。
ps跨浏览器兼容性不是必需的。 我可以和Gecko和/或Webkit一起使用。
你将不得不find一个JavaScript的方式来做到这一点，我很确定。 任何CSS技术，即使可能，都不会是跨浏览器的。
没有办法通过CSS来完成，但是你可以像这样扩展Numbertypes：
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, '.', ' ')
该死的，我快到了！
跨度 {
显示：块;
-moz柱 - 间隙：5像素;
-moz列宽度：24像素;
自动换行：打破字;
}
<跨度> 100000 </跨度>
<跨度>百万</跨度>
<跨度>千万</跨度>
<跨度>亿</跨度>
给我
100 000 100 000 0 100 000 00 1亿
唯一剩下的就是从右边开始分裂。 现在试验direction: rtl等:)
如果您不愿意使用JavaScript来更改格式，则应该从服务器更改它们的格式（即在呈现页面之前）。
这是一个可行的build议， 虽然我会承认这不是很好 。
使用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();
你会得到平原1000000回。
CSS：
.triad { padding-left: 5px; }
n1313， http ://wiki.csswg.org/ideas/content-formatting;）这不是一个解决scheme，只是想法
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操作string。 Sry你必须用JS来完成
如何有两次数字：一次用于显示和一次这样的操作：
<span class="money" data-value="1000000">$ 1 000 000</span>
然后你可以很容易地使用getAttribute('data-value')从你的JS中获得值，并以任何你想要的方式格式化数字。
data-*属性是HTML 5中的一个新function，但几乎所有当前浏览器都支持它（DOM中的.dataset属性，因此您必须在当前/旧版浏览器中使用getAttribute() ）。
我希望这是可能的与CSS :(你不能获得文本值，并在以后使用CSS的操作中使用。
首先想到的是使用:after和:before与content:" "
那么你只需要dynamic地在正确的数字周围添加标签并对其进行devise。
