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 是默认值.就是按正常的布局流从上到下从左到右布局,平常我们做网页时,没有指定 ...
随机推荐
- 001_a记录和canme的区别
1.什么是域名解析? 域名解析就是国际域名或者国内域名以及中文域名等域名申请后做的到IP地址的转换过程.IP地址是网路上标识您站点的数字地址,为了简单好记,采用域名来代替ip地址标识站点地址.域名的解 ...
- Centos6.5使用ELK(Elasticsearch + Logstash + Kibana) 搭建日志集中分析平台实践
Centos6.5安装Logstash ELK stack 日志管理系统 概述: 日志主要包括系统日志.应用程序日志和安全日志.系统运维和开发人员可以通过日志了解服务器软硬件信息.检查配置过程中的 ...
- 转载：configure执行流程（1.5.2）《深入理解Nginx》（陶辉）
原文:https://book.2cto.com/201304/19619.html 我们看到configure命令支持非常多的参数,读者可能会好奇它在执行时到底做了哪些事情,本节将通过解析confi ...
- python接口自动化测试一：http协议
1. http简介:http(超文本传输协议)是一个基于请求与响应模式的.无状态的.应用层的协议 2. url详解:百度搜索的一个url地址:https://www.baidu.com/s?wd=%E ...
- 去除HTML5 SUMMARY 标签前的三角形
在CSS添加如下代码(Chrome): details summary::-webkit-details-marker { display:none; }
- 微服务的发现与注册--Eureka
目录 服务提供者.服务消费者.服务发现组件三者之间的关系 Eureka 简介 Eureka Server Eureka Client 编写Eureka Server 将微服务注册到Eureka Ser ...
- thinkphp注册验证
在model中新建一个UserModel //覆盖原本的设置 //一次性获得全部验证错误 protected $patchValidate = true; //实现表单项目验证 //通过重写父类属性_ ...
- #2 codeforces 480 Parcels
题意: 就是有一个用来堆放货物的板,承重力为S.现在有N件货物,每件货物有到达的时间,运走的时间,以及重量,承重,存放盈利.如果这件货物能再运达时间存放,并在指定时间取走的话,就能获得相应的盈利值.货 ...
- bzoj 4503
没有权限号就只能对拍了 我们令?代表的T值=0,然后设出这样一个式子 这样一来,只要T和S在j位置匹配,当且仅当Dj=0,然后我们将这个式子拆开,变成下面那样 思路大概就是这样 最后发现答案应该是在a ...
- python学习之基本数据类型
python的基本数据类型有数字.字符串.列表.字典.元祖.布尔值 一.数字 1.1.字符转换为数字 实例: a=" b=int(a) print(b+) 运行结果: 可以用type查看数据 ...