使用内联CSS在HTML表中应用USD货币格式

Question

我正在创建定期发布的销售数据网络广播，并且正在努力以美元货币格式正确格式化销售总额（$符号，数千位逗号分隔符，2位小数）。使用以下文件控制网络广播。我是一个完整的HTML＆amp; CSS新手，所以欣赏任何具体的指导。我一直在研究和测试，但只需要任何帮助或想法 - 谢谢！

到目前为止尝试过： 为此创建SPAN，例如：             .dollars：在{content：'$';}之前        

此外：                     {资源}             {销售额}         

我也试过这个但是无法让它运转起来。 http://www.webdeveloper.com/forum/showthread.php?43459-CSS-number-formatting 和

<style type='text/css'>
	caption.mytable
	{
		background-color:99CCFF;
		color:black;
		border-style:solid;
		border-width:1px;
		border-color:336699;
		text-align:center;
	}

	table.mytable
		{ 
		font-family:Tahoma;
		border-collapse:collapse;
		font-size:10pt;
		background-color:white;
		width:100%;
		border-style:solid;
		border-color:336699;
		border-width:1px;
	}

	th.mytable
	{
		font-size:8pt;
		color:black;
		text-align:center;
		font-weight:bold;
	}

	tr.mytable
	{ 
	}

	td.mytable
	{  
		font-size:8pt;
		background-color:white;
		color:black;
		border-style:solid;
		border-width:1px;
		border-color:cccccc;
		text-align:left;
		padding:3px;
	}
</style>

<table class='mytable'>
	<caption class="mytable">{EVENT_DESCRIPTION_COLOR} as of {EVENT_DATE}</caption>
	<thead>
		<tr class='mytable'>
			<th class='mytable'>Source Type</th>
			<th class='mytable'>Sales Amount</th>
		</tr>
	</thead> 
	<tbody>
		
		<tr class='mytable'>
			<td class='mytable'>{Source}</td>
			<td class='mytable'>{SalesAmount}</td>
		</tr>
		
	</tbody>
</table>
<style type='text/css'>
	caption.mytable
	{
		background-color:99CCFF;
		color:black;
		border-style:solid;
		border-width:1px;
		border-color:336699;
		text-align:center;
	}

	table.mytable
		{ 
		font-family:Tahoma;
		border-collapse:collapse;
		font-size:10pt;
		background-color:white;
		width:100%;
		border-style:solid;
		border-color:336699;
		border-width:1px;
	}

	th.mytable
	{
		font-size:8pt;
		color:black;
		text-align:center;
		font-weight:bold;
	}

	tr.mytable
	{ 
	}

	td.mytable
	{  
		font-size:8pt;
		background-color:white;
		color:black;
		border-style:solid;
		border-width:1px;
		border-color:cccccc;
		text-align:left;
		padding:3px;
	}
</style>

<table class='mytable'>
	<caption class="mytable">{EVENT_DESCRIPTION_COLOR} as of {EVENT_DATE}</caption>
	<thead>
		<tr class='mytable'>
			<th class='mytable'>Source Type</th>
			<th class='mytable'>Sales Amount</th>
		</tr>
	</thead> 
	<tbody>
		
		<tr class='mytable'>
			<td class='mytable'>{Source}</td>
			<td class='mytable'>{SalesAmount}</td>
		</tr>
		
	</tbody>
</table>

Answer 1

您自己的解决方案有效。检查一下：

.dollars:before {
  content: "$";
}
.euros:after {
  content: "€";
}

<table>
  <tr><td class='mytable'><span class="dollars">788.99</span></td></tr>
  <tr><td class='mytable'><span class="euros">788.99</span></td></tr>
</table>

修改

您可以使用此功能（来自http://phpjs.org）来控制数字：

function number_format(number, decimals, dec_point, thousands_sep) {

  number = (number + '')
    .replace(/[^0-9+\-Ee.]/g, '');
  var n = !isFinite(+number) ? 0 : +number,
    prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
    sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
    dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
    s = '',
    toFixedFix = function(n, prec) {
      var k = Math.pow(10, prec);
      return '' + (Math.round(n * k) / k)
        .toFixed(prec);
    };
  // Fix for IE parseFloat(0.55).toFixed(0) = 0;
  s = (prec ? toFixedFix(n, prec) : '' + Math.round(n))
    .split('.');
  if (s[0].length > 3) {
    s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, sep);
  }
  if ((s[1] || '')
    .length < prec) {
    s[1] = s[1] || '';
    s[1] += new Array(prec - s[1].length + 1)
      .join('0');
  }
  return s.join(dec);
}

alert(number_format(8277267283832.289877, 2, ".",","));


  //   example 1: number_format(1234.56);
  //   returns 1: '1,235'
  //   example 2: number_format(1234.56, 2, ',', ' ');
  //   returns 2: '1 234,56'
  //   example 3: number_format(1234.5678, 2, '.', '');
  //   returns 3: '1234.57'
  //   example 4: number_format(67, 2, ',', '.');
  //   returns 4: '67,00'
  //   example 5: number_format(1000);
  //   returns 5: '1,000'
  //   example 6: number_format(67.311, 2);
  //   returns 6: '67.31'
  //   example 7: number_format(1000.55, 1);
  //   returns 7: '1,000.6'
  //   example 8: number_format(67000, 5, ',', '.');
  //   returns 8: '67.000,00000'
  //   example 9: number_format(0.9, 0);
  //   returns 9: '1'
  //  example 10: number_format('1.20', 2);
  //  returns 10: '1.20'
  //  example 11: number_format('1.20', 4);
  //  returns 11: '1.2000'
  //  example 12: number_format('1.2000', 3);
  //  returns 12: '1.200'
  //  example 13: number_format('1 000,50', 2, '.', ' ');
  //  returns 13: '100 050.00'
  //  example 14: number_format(1e-8, 8, '.', '');
  //  returns 14: '0.00000001'