fixed、absolute
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>测试absolute与fixed</title>
<style type="text/css"></style>
<link rel="stylesheet"href="position.css">
</head>
<body style="height:1000px;">
<div id="left">absolute</div>
<div id="right">fixed</div>
</body>
<h1>fixed相对移动的坐标是视图（屏幕内的网页窗口）本身，而absolute相对body坐标原点进行定位</h1>
</html>
div{
width:100px;
height:100px;
background:yellow;
}
#left{
left:0px;
top:100px;
font-size:28px;
position:absolute;
}
#right{
right:0px;
top:100px;
font-size:28px;
position:fixed;
}
h1{
left:0px;
top:100px;
font-size:18px;
}
fixed、absolute的更多相关文章
- Position属性四个值：static、fixed、absolute和relative的区别和用法
Position属性四个值:static.fixed.absolute和relative的区别和用法 在用CSS+DIV进行布局的时候,一直对position的四个属性值relative,absolu ...
- Position属性四个值：static、fixed、absolute和relative的区别
1.static(静态定位):默认值.没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明). 2.relative(相对定位):生成相对 ...
- CSS - 定位属性position使用详解（static、relative、fixed、absolute）
position 属性介绍 (1)position 属性自 CSS2 起就有了,该属性规定元素的定位类型.所有主流浏览器都支持 position 属性. (2)position 的可选值有四个:sta ...
- HTML静态网页的格式与布局（position：（fixed、absolute、relative）、分层、float（left、right））
一.position:fixed 锁定位置(相对于浏览器的位置),例如有些网站的右下角的弹出窗口. 示例: 二.position:absolute 1.外层没有position:absolute(或r ...
- fixed和absolute的区别
今天在实际项目中,写首页一屏的时候,发现页脚定位(position:absolute:)没有达到我想要的效果(不管屏幕大小,页脚始终相对浏览器底部定位).于是我觉得有点奇怪,然而我旁边的小哥说:很明显 ...
- Position属性四个值：static、fixed、relative、absolute的区别和用法
1.static(静态定位):默认值.没有定位,元素出现在正常的文档流中(如果设置 top, bottom, left, right, z-index这些属性就不起做作了). 2.relative(相 ...
- [转]关于position 的 static、relative、absolute、fixed、inherit
本文转自:http://www.56770.com/faq/list/?id=410 position 有五个值:static.relative.absolute.fixed.inherit. sta ...
- position的static、relative、absolute、fixed、inherit
网上有很多关于position的讲解,也有很多他们属性之间的比较,但是比较全面的讲解还是比较少,每次看完过段时间就忘了,所以今天参考了很多网上现有的资源,自己整理一下,写下这篇文章. position ...
- position 有五个值：static、relative、absolute、fixed、inherit。
position 有五个值:static.relative.absolute.fixed.inherit. static 是默认值.就是按正常的布局流从上到下从左到右布局,平常我们做网页时,没有指定 ...
随机推荐
- sqlyog通过跳板机ssh连接mysql数据库
方法一: 方法二: 在跳板机上启动sh脚本做ssh端口转发,客户端配置连接 10.0.0.1的8306端口即可 jdbc:mysql://10.0.0.1:8306/testdb?useUnicode ...
- android项目结构
- S5PV210 看门狗定时和复位
第一节 S5PV210的看门狗定时器S5PV210上的看门狗定时器相当于一个普通的16bit的定时器,它与PWM定时器的区别是看门狗定时器可以产生reset信号而PWM定时器不能,S5PV210看门狗 ...
- javascript 浮点数比较
Js中两个浮点数比较,不能使用=== 必须用相减绝对值小于极小的一个数字来判断 Math.abs(1/3 - (1-2/3))<0.0001 这样的方式来判断.
- vue系列之webstrom的设置
1.安装vue插件,方法 Setting->Plugins,点击Plugins,在右边输入vue,找到相应插件,然后安装 2.创建vue模板 注意红圈里面的 3.设置vue文件支持的样式 注意: ...
- OCM_第二天课程：Section1 —》配置 Oracle 网络环境
注:本文为原著(其内容来自 腾科教育培训课堂).阅读本文注意事项如下: 1:所有文章的转载请标注本文出处. 2:本文非本人不得用于商业用途.违者将承当相应法律责任. 3:该系列文章目录列表: 一:&l ...
- C++ code：prime decision
1 判断一个数是否为素数 对于判断一个数m是否为素数,最朴素的方式是按照素数的定义,试除以从2开始到m-1的整数,倘若无一例外地不能整除,则该数必为素数. #include<iostream&g ...
- cf789c
主要是线性时间内求最大连续和 #include<bits/stdc++.h> using namespace std; #define maxn 200005 #define ll lon ...
- Unicode转义序列
声明: web前端学习笔记,欢迎大神指点.联系QQ:1522025433. Javascipt 定义了一种特殊序列,使用6位ASCII字符代表任意16Unicode内码.这些Unicode转义序列均以 ...
- Hibernate的CRUD以及junit测试
Hibernate的CRUD以及junit测试 1:第一步创建动态工程引包,省略. 2:第二步,创建数据库和数据表,省略. 3:第三步,创建实体类,如User.java,源码如下所示: 对于实体类,一 ...