第一种：伪对象选择器
在webkit内核的浏览器里可以定义滚动条样式。在CSS初始处定义
第二种：变相隐藏
大体思路是在div外面再套一个div。这个div设置overflow:hidden。
而内容div设置 overflow-x: hiddenoverflow-y: scroll然后再设置外层div的width小于内容div的width，就是用一个无滚动条的div包裹另一个有滚动条的div，从而实现隐藏滚动条的效果。
你最好使用滑块插件了。建议你看下这篇文章，能很好地解决你的问题-可以滑动滑块时实时显示数字。网页链接 是基于bootstrap里的一个slider插件，很好用。这篇有详细介绍，并且最下方有demo演示以及详细的API地址。
<input id="ex1" data-slider-id='ex1Slider' type="text" data-slider-min="0" data-slider-max="20" data-slider-step="1" data-slider-value="14"/> $('#ex1').slider({formatter: function(value) {
return 'Current value: ' + value
}
})
// Without JQuery
var slider = new Slider('#ex1', {
formatter: function(value) {
return 'Current value: ' + value
}
})
下面是整个网页代码，已经写好了，你运行一下吧。<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<div align="center">
<p>你说的是这个吧</p>
<p>
<textarea name="1" id="1" cols="20" rows="5">哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈啊哈哈哈哈暗乎乎</textarea>
</p>
</div>
</form>
</body>
</html>
