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 是默认值.就是按正常的布局流从上到下从左到右布局,平常我们做网页时,没有指定 ...
随机推荐
- nginx报错：403 Forbidden 并且访问首页index.php是下载文件的状态
nginx报错:403 Forbidden 并且访问首页index.php是下载文件的状态,不能正常解析php 系统有其他两个站访问是正常的 看日志没有看到明显的错误 搜索了下: 答案如下: php的 ...
- nagios系列(八)之nagios通过nsclient监控windows主机
nagios通过nsclient监控windows主机 1.下载NSClient -0.3.8-Win32.rar安装在需要被监控的windows主机中 可以设置密码,此处密码留空 2.通过在nagi ...
- 转载：获取Nginx源码（1.3.5）《深入理解Nginx》（陶辉）
原文:https://book.2cto.com/201304/19616.html 可以在Nginx官方网站(http://nginx.org/en/download.html)获取Nginx源码包 ...
- VMware环境和Window环境进行网络连接的问题
一. 首先贴出本人在网络上找到与VMware网络连接相关的知识点 安装完虚拟机后,默认安装了两个虚拟网卡,VMnet1和VMnet8,其他的未安装(当然也可以手动安装其他的).其中VMnet1是hos ...
- [转]Apache Commons IO入门教程
Apache Commons IO是Apache基金会创建并维护的Java函数库.它提供了许多类使得开发者的常见任务变得简单,同时减少重复(boiler-plate)代码,这些代码可能遍布于每个独立的 ...
- php中相对路径和绝对路径如何使用（详解）
目录 一.总结 一句话总结: 1.php中用用“/”表示根目录么? 2.什么符号表示当前目录(asp,jsp,php都一样)? 3.php中如何使用$_SERVER['DOCUMENT_ROOT']做 ...
- 改变input标签中placeholder显示的颜色
::-webkit-input-placeholder { /* WebKit browsers */ color: #A9A9A9; } :-moz-placeholder { /* Mozilla ...
- python之__dict__与dir(转载）
Python下一切皆对象,每个对象都有多个属性(attribute),Python对属性有一套统一的管理方案. __dict__与dir()的区别: dir()是一个函数,返回的是list: __di ...
- Java 导入数据到Excel并提供文件下载接口
作者:Howie_Y链接:https://juejin.im/post/5ab4799451882521d6577fe4 最近的项目中遇到了一个将数据库的信息导入到一个 Excel 文件的需求,而且还 ...
- 上传本地文件到github仓库基本操作
上传文件到github时老师忘记指令,或者总是出一些错,每次都要百度浪费时间,因此将常用操作指令归纳卸载这里,以后再也不要担心百度找帖子了... 第一步:新建仓库 新建仓库步骤省略,最后我们得到一个仓 ...