css div固定顶部例子
发布时间:2019-10-29 编辑:jiaochengji.com
教程集为您提供css div固定顶部例子等资源,欢迎您收藏本站,我们将为您提供最新的css div固定顶部例子资源
固定顶部只需要利用css画实现绝对定位就可以了,操作方法也是非常的简单容易了,下面小编就来为各位介绍一下吧,希望例子可以帮助到各位朋友。
有很多网站都有固定在顶部的html样式但是不知道怎么弄啊!费了很大的力气才知道这个是关键字是 html div css 固定顶部 而且这个代码还支持半透明哦! 好了这个代码支持ie和360 至于ie6 是否也支持我就不知道咯!下面就是代码了
例子
<pre class="brush:css;toolbar:false"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>CSS定义一个固定在页面顶部的层</title> <style type="text/css"> body { height:1200px; margin: 0; padding: 0; background-attachment: fixed; /* prevent screen flash in IE6 */ } div,ul{margin: 0;padding: 0;} #topNavWrapper { width: 980px; text-align: left; height: 31px; margin: 0px auto; z-index:100; _position: relative ; _top:0px; } #topNav { width: 980px; float: left; display: block; z-index: 100; overflow: visible; position: fixed; top: 0px; /* position fixed for IE6 */ _position: absolute; _top: expression(documentElement.scrollTop "px"); background-image: url( /uploadfile/2012/0717/0717014456145_4456.gif); background-repeat: no-repeat; background-position: right; height: 31px; line-height: 31px; color:#fff; background-color:#444; text-align:center; } </style> </head> <body> <div id="topNavWrapper"> <ul class="jd_menu" id="topNav"> 我是固定在页面顶部的层 </ul> </div> </body> </html></pre>您可能感兴趣的文章:
jquery实现固定在顶部的菜单
css div固定顶部例子
css div绝对定位与固定定位实例
网页中返回顶部代码(多种方法)另附注释说明
CSS基本布局16例
IE6中position:fixed无效问题解决
jQuery 菜单随滚条改为以定位方式(固定要浏览器顶部)
自动固定顶部的悬浮菜单栏代码(三个例子,三种方法)
js 完美的仿新浪顶部固定的横条
CSS3和jQuery实现花瓣网固定顶部位置悬浮菜单效果
[关闭]