CSS绝对定位模拟固定定位
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
html,body{
height: 100%;
overflow: hidden;
}
#wrap{
height: 100%;
border: 1px solid deeppink;
overflow: auto;
}
#pink{
position: absolute;
left: 0;
top: 0;
width: 200px;
height: 200px;
background: pink;
}
</style>
</head>
<body>
<div id="wrap">
<div id="pink"></div>
<div id="test" style="height: 3000px;"></div>
</div>
</body>
</html>
CSS绝对定位模拟固定定位的更多相关文章
- css定位:相对定位、绝对定位、固定定位的区别与特性
css定位:相对定位.绝对定位.固定定位的区别与特性 原文地址:http://www.qingzhouquanzi.com/106.html css定位常用的有以下三种: 使用了定位的共同特性: 这三 ...
- HTML+CSS基础知识(5)相对定位、绝对定位、固定定位
文章目录 1.相对定位 1.1 代码 1.2 测试结果 2.绝对定位 2.1 代码 2.2 测试 3.固定定位 3.1 代码 3.2 测试结果 1.相对定位 1.1 代码 <!DOCTYPE h ...
- 解决ie6下不支持fix属性,模拟固定定位
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...
- WEB学习 -相对定位、绝对定位、固定定位、z-index
相对定位 相对定位,就是微调元素位置的.让元素相对自己原来的位置,进行位置调整. .不脱标,老家留坑,形影分离 也就是说相对定位不脱标,真实位置是在老家,只不过影子出去了,可以到处飘. 3.相对定位用 ...
- CSS的三种手段让元素脱离标准本文档流——浮动、绝对定位、固定定位
1.浮动 浮动是CSS中用到的最多的一个选项,他有三个性质.关于浮动我们要强调一点,永远不是一个东西单独浮动,浮动都是一起浮动,要浮动,大家都浮动. 1.1 浮动元素脱离标准文档流 1.1.1 大概描 ...
- CSS学习笔记10 相对定位,绝对定位与固定定位
文档流中的元素的位置由元素在 (X)HTML 中的位置决定,这就是最原始的普通流,前面讲到的浮动CSS学习笔记08 浮动可以改变元素在文档流中的位置,除了这个我们还可以通过使用CSS的position ...
- CSS定位:相对定位、绝对定位和固定定位(relative absolute fixed)
相对定位:position:relative; 不脱离文档流,参考自身静态位置通过top,bottom,left,right定位,并且可通过z-index进行层次分级. 绝对定位:position:a ...
- CSS——相对定位、绝对定位、固定定位
相对定位: position:relative 当元素被设置相对定位或是绝对定位后,将自动产生层叠,他们的层叠级别自然的高于文本流,除非设置其z-index值为负值. 并且我们发现当相对定位元素进行位 ...
- 理解CSS相对定位和固定定位
× 目录 [1]相对定位 [2]固定定位 前面的话 一般地,说起定位元素是指position不为static的元素,包括relative.absolute和fixed.前面已经详细介绍过absolut ...
随机推荐
- openstack-wsgi的route中添加api流程具体解释(os-networks)添加
感谢朋友支持本博客.欢迎共同探讨交流,因为能力和时间有限,错误之处在所难免.欢迎指正! 如有转载,请保留源作者博客信息. Better Me的博客:blog.csdn.net/tantexian 如需 ...
- 【Android】使用 SwipeRefreshLayout 实现下拉刷新
今天在codepath 上看到一个开源项目 [点击查看]使用到了 SwipeRefreshLayout 实现了下拉刷新,但演示样例并不完整,于是自己就动手写了下.之前看到郭霖的博客上也有介绍下拉刷新, ...
- Android一些网站介绍
1.开源镜像: Android SDK在线更新镜像服务器 中国科学院开源协会镜像站地址: IPV4/IPV6: http://mirrors.opencas.cn 端口:80 IPV4/IPV6: h ...
- Flask中的ThreadLocal本地线程,上下文管理
先说一下和flask没有关系的: 我们都知道线程是由进程创建出来的,CPU实际执行的也是线程,那么线程其实是没有自己独有的内存空间的,所有的线程共享进程的资源和空间,共享就会有冲突,对于多线程对同一块 ...
- 830C
分块+二分 这道题思路很巧妙 我们大概可以推出一个式子sigma(d-[(ai-1)%d+1])<=k,要求求出d的最大值 然后我们化简一下,sigma(d-[(ai-1)-[(ai-1)/d] ...
- 一个单例(Singleton),并说明单例的目的和好处
单例的目的:保证一个类只有单一的实例,也就是说你无法通过new来创建这个类的一个新实例. 单例的好处:当一个对象在程序内部只能有一个实例的时候,它可以保证我们不会重复创建,而是始终指向同一个对象. S ...
- HTML5牛刀小试
第一周的HTML5苦逼之路,就这么简单,充实,忙碌的开始了,丝毫不敢有一丢丢懈怠,压力是有的,但更多的是对自己的信心,更是对自己的踏上苦逼之路的意志的肯定. 简单回顾了下这周所学内容.从认识HTML基 ...
- [Swift]圆周率π
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...
- mysql 根据总分排名
mysql 根据总分排名 SELECT t.*, @rank := @rank + AS rank FROM ( SELECT @rank := ) r, ( SELECT tas.id, tas.t ...
- 2017杭电多校第五场Rikka with Subset
Rikka with Subset Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others ...