css 兼容 position:fixed
有多少内容,我就有多高
我要随滚动条滚动
我要随滚动条滚动
<!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=utf-8" /> <meta content="IE=EmulateIE7" http-equiv="X-UA-Compatible"><!--据说这个可以只需要兼容IE7--> <title>无标题文档</title> <style type="text/css"> *{margin:0; padding:0; border:0;} #d{ background:url(images/index_bg.jpg) repeat-y scroll center top transparent; left: 50%; margin-left: -500px; position: relative; width: 1000px; } .top,.main,.bottom,.fixed{text-align:center;} .top{ background-color:#C30; height: 101px; padding-top: 4px; } .main{ width:980px; margin:20px auto 0; background-color:#FC0; padding:10px; } .main .cont{height:900px;} .main .cont .contL,.main .cont .contR{ float:left; } .main .cont .contL{ width:750px; background-color:#93C; height:900px; margin-right:15px; } .main .cont .contR{ width:210px; background-color:#33F; height:500px; } .bottom{ background-color:#00F; clear: both; color: #373737; height: 192px; margin: 10px auto; overflow: hidden; padding-top: 20px; width: 1000px; } .fixed{ width:190px; line-height:40px; padding-top:20px; padding-bottom:20px; background-color:#999; position:fixed; left:65%; top:160px; z-index:999;/*为了让DIV永远在最前面,不被其他元素遮住*/ _position:absolute;/*这里开始的2句代码是为ie6不兼容position:fixed;而写的*/ _top:expression(eval(document.documentElement.scrollTop+160));/*这里需要获取滚动高度+元素原本的高度*/ } </style> </head> <body> <div id="d"> <div class="top">我是头</div> <div class="main"> 我是主体<br /> 有多少内容,我就有多高<br /> <div class="cont"> <div class="contL"></div> <div class="contR"></div> </div> </div> <div class="bottom">我是脚</div> </div> <div class="fixed"> 我要随滚动条滚动<br /> 我要随滚动条滚动<br /> 我要随滚动条滚动<br /> </div> </body> </html>
css 兼容 position:fixed的更多相关文章
- 小技巧css解决移动端ios不兼容position:fixed属性,无需插件
移动端开发仿app头部底部固定设置position:fixed,android2.2以上已经实现.但是在ios8以下系统,当小键盘激活时,都会出现位置浮动问题.如图: 如何解决: 查阅资料之后想到一下 ...
- 让IE6兼容position:fixed
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- css中position:fixed实现div居中
上下左右 居中 代码如下 复制代码 div{ position:fixed; margin:auto; left:0; right:0; top:0; bottom:0; width:200px; h ...
- IOS系统不兼容position: fixed;属性的解决方案
position: fixed;属性在IOS系统手机上会有很明显的抖动,解决方式: 只需要在中间部分外层div添加css样式position:fixed;top:50px; bottom:50px;o ...
- CSS中position:fixed的用法
我们都知道CSS中定位属性position的值,除了默认的值外,还有absolute,relative和fixed.我平时比较常用absolute和relative,而position:fixed却没 ...
- CSS中position:fixed的相关用法
CSS中的三大重点知识: 1.float,浮动 2.盒子模型 3.position绝对定位 今天主要写下position中fixed相关知识: position:static,relative,abs ...
- position:fixed 兼容浏览器低版本
项目中遇到的坑,写篇博客做个笔记纪念下,position: fixed一般来说都兼容各个浏览器,但是要兼容浏览低版本问题,就得用-webkit-transform: translateZ(0);这段代 ...
- 苹果手机对网页上样式为position:fixed的弹窗支持不好的解决办法
在Web页面上,如果想模拟对话框效果,一般会给div元素添加position:fixed的样式来实现,然后给背景添加一个半透明的遮罩.如: .fixedDiv { position: fixed; t ...
- ios position:fixed 上滑下拉抖动
ios position:fixed 上滑下拉抖动 最近呢遇到一个ios的兼容问题,界面是需要一个头底部的固定的效果,用的position:fixed定位布局,写完测试发现安卓手机正常的,按时ios上 ...
随机推荐
- thinkphp如何写find_in_set这样的orm查询封装
今天写thinkphp的orm封装的时候 需要写一个 select * from table where user_id=xxx and find_in_set(100,group_id)这样的SQL ...
- sql语句书写升降序
1, desc:降序,明天今天昨天,zyx...cba,.....321 sql语句:select * from SC_BackDiggingInfo where WriteDate<='201 ...
- DevExpress 用户控件 分页(中)
说明: 1)具体调用请关注 看DevExpress 用户控件 分页(下) datanavi_ButtonClick 是DataNavigator的ButtonClikc事件 视图设计器: 分页用户控件 ...
- Android 镜像地址[持续更新中]
这里收集android国内镜像资源地址 大连东软信息学院镜像服务器地址:– http://mirrors.neusoft.edu.cn 端口:80北京化工大学镜像服务器地址:– IPv4: http: ...
- Qt4--加密日记本(子例化QMainWindow文本加密解密)
近来刚学习Qt4编程,想找个实例练习练习,于是产生了一个想法,就是怎么样做一个文本加密,这样,自己保存的一些文档可以通过软件 生成加密文本,到时候要看的时候,通过自己的软件读取就可以.既然有想法了,那 ...
- Python 3语法小记(六)条件、循环和assert、pass、del
条件: if 条件: 语句块 elif: 语句块 else: 语句块 elif 表示 else if 这居然是合法的!!!1 < x < 2!!! >> ...
- c pointer and array
Pointer: A pointer is a variable that contains the address of a variable. if c is a char and p is a ...
- CFileDialog的使用方法简单介绍
CFileDialog文件选择对话框的使用:首先构造一个对象并提供对应的參数,构造函数原型例如以下: CFileDialog::CFileDialog( BOOL bOpenFileDialog, L ...
- allocator例子
13.39 编写自己的StrVec,包括自己版本的reserve.capacity和resize. 13.40 为StrVec添加一个构造函数,它接受一个initializer_list<str ...
- PureMVC(JS版)源码解析(一):观察者模式解析
假设一种情景,在程序开发中,我们需要在某些数据变化时,其他的类做出相应,例如在游戏中,升级一件装备,会触发玩家金币数量改变,背包数据改变和冷却队列数据改变等等.我们不可能设置setInte ...