![如何用css设置网页字体[多图]](/aiimages/%E5%A6%82%E4%BD%95%E7%94%A8css%E8%AE%BE%E7%BD%AE%E7%BD%91%E9%A1%B5%E5%AD%97%E4%BD%93%5B%E5%A4%9A%E5%9B%BE%5D.png)
css可以通过为网页元素设置滚动条样式使网页元素的内容实现滚动。
css通过overflow属性设置滚动条示例：
<html>
<head>
<style type="text/css">
div
{
background-color:#00FFFF
width:150px
height:150px
overflow: scroll
}
</style>
</head>
<body>
<p>如果元素中的内容超出了给定的宽度和高度属性，overflow 属性可以确定是否显示滚动条等行为。</p>
<div>
这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，
用户代理都会提供一种滚动机制。因此，有可能即使元素框中可以放下所有内容也会出现滚动条。默认值是 visible。
</div>
</body>
</html>
效果图
扩展：
overflow属性介绍：
overflow 属性规定当内容溢出元素框时发生的事情。
说明
这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，用户代理都会提供一种滚动机制。因此，有可能即使元素框中可以放下所有内容也会出现滚动条。
属性值：
visible 默认值。内容不会被修剪，会呈现在元素框之外。
hidden 内容会被修剪，并且其余内容是不可见的。
scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。
inherit 规定应该从父元素继承 overflow 属性的值。
完全用CSS控制就可以了，页面在滚动，给这个DIV设置position:fixed那么页面不管怎么滚动，这个DIV是中在顶端解决方案二：
显示合作div absolute定位，判断滚动到div位置的时候设置position为fixed，同时设置top为0
<div style="height:500pxbackground:#999"></div>
<div id="fixedMenu" style="background:#eeewidth:100%">我是菜单，我到页头会固定</div>
<div style="height:900pxbackground:#999"></div>
<script type="text/javascript" src="http://www.coding123.net/js/jquery.js"></script>
<script type="text/javascript">
$(function () {
var ie6 = /msie 6/i.test(navigator.userAgent)
, dv = $('#fixedMenu'), st
dv.attr('otop', dv.offset().top)//存储原来的距离顶部的距离
$(window).scroll(function () {
st = Math.max(document.body.scrollTop || document.documentElement.scrollTop)
if (st >= parseInt(dv.attr('otop'))) {
if (ie6) {//IE6不支持fixed属性，所以只能靠设置position为absolute和top实现此效果
dv.css({ position: 'absolute', top: st })
}
else if (dv.css('position') != 'fixed') dv.css({ 'position': 'fixed', top: 0 })
} else if (dv.css('position') != 'static') dv.css({ 'position': 'static' })
})
})
</script>
解决方案三：
对页面y轴偏移量进行判断，如果大于某个值（具体情况具体应对），克隆原来的层，设置新的id，新的id意味着新的css样式：position：fixed，然后隐藏原来的层，添加克隆的层； 否则，即向上滑动到一定位置时，remove克隆的层，显示隐藏的层，达到目的~代码仅供参考。。。
$(window).scroll(function(){
if(window.pageYOffset>108){
if($("#topbar").length == 0){
var x=$("#wrap_most_used_bookmark").clone()
x.attr("id","topbar")
$("body").append(x)
$("#return_top").fadeIn()
}
}
else{
$("#topbar").remove()
$("#return_top").fadeOut()
}
})
