这个事css干不了吧，怎么也得用上js。
css只能改变显示的样子，在Dom中做改动得用js了
js代码拿去用：
function number_format(number, decimals, dec_point, thousands_sep) {/*
* 参数说明：
* 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.ceil(n * k) / k
}
s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.')
var re = /(-?\d+)(\d{3})/
while (re.test(s[0])) {
s[0] = s[0].replace(re, "$1" + sep + "$2")
}
if ((s[1] || '').length < prec) {
s[1] = s[1] || ''
s[1] += new Array(prec - s[1].length + 1).join('0')
}
return s.join(dec)
}
使用方法：
var num=number_format(1234567.089, 2, ".", ",")//1,234,567.09<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script><!--引入jquery库--><style>
* {margin:0padding:0}
.parentCls {margin:0position:relative}
.inputElem {height:24px border:1px solid #ddd outline:none }
#fixval {position:absolute top:-35px left:0 display:none border:1px solid #ddd background:#fff font-size:18px font-weight:bold color:#F60 padding:5px }
</style>
<div style="height:50px"></div>
<div class="parentCls">
<input type="text" class="inputElem" autocomplete = "off" maxlength="18"/>
<div id="fixval"></div>
</div>
<script>
$(function(){
$(".inputElem").keyup(function(event){
var txt = $(this).val()
var keyCode = event.which
if ( txt.length<=0 ) {
$("#fixval").hide()
}else{
if ( $.isNumeric(txt) !== true || keyCode==32 ){//判断输入类型，并去除空格
$(this).val( txt.slice(0,-1) ) //截掉非数字和空格
return false
}
var re=/(?=(?!\b)(\d{3})+$)/g //分割数字 1,000
txt = txt.replace(re,",")
$("#fixval").html(txt).show()
}
})
})
</script>
一、CSS简介CSS(Cascading Style Sheet)层叠样式表，它是用来美化页面的一种语言，之前提到的W3C规范中的“样式”。作用：1、美化界面。2、页面布局。基本语法：选择器{样式规则}样式规则：属性名1：属性值1属性名2：属性值2属性名3：属性值3。。。选择器:是用来选择标签的，选出来以后给标签加样式。从Hello World说起，<p style="background-color:#FFFcolor:#000font-size:30px">Hello World!</p>这样写可以实现将原本的白底黑字Hello World! 改成样式为 黑底白字的效果。但是这样写有一定的缺点：缺点1：内容、样式、行为三者未分离，代码糅杂，不符合W3C规范，难以维护。缺点2：代码冗余，不可复用。二、如何引入CSS？1）行内样式即上述的一般形式，由于其存在的缺点，介绍下一种样式。2）内嵌样式，给p标签加样式，加在head标签中<style type="text/css">p{background-color:#FFFcolor:#000font-size:30px}</style>当本页面的p标签都需要相同的样式时，这样写大大降低了代码量，并让其他编程人员一眼分辨出来CSS样式。3）链接样式（链入式）在head标签中加入<link href="../css/my.css" type="text/css" rel="stylesheet"/>将CSS文件和html文件分开来放，这样增加了代码的重用性，但是每个浏览器都要单独读取css文件中的样式，比较慢，如果追求速度，内嵌样式会更好。4）导入样式<style type="text/css">@import url("路径名")</style>四种样式的优先级：如果一个页面中四种样式同时存在，这四种都会对标签起作用，但是重复样式的属性值，只有最后一个有效。如果内嵌样式和导入样式放在一起，则内嵌样式起作用。如果内嵌样式和导入样式分成两个style定义，则在CSS样式中的最后一个style起作用。附：css中注释的格式，没有单行注释，所有的注释均是/*注释内容*/
