CSS中相对定位与绝对定位
看了几个讲解定位的博客,觉得还不错,分享之:
博客一:http://blog.sina.com.cn/s/blog_4bcf4a5e010008o0.html
文章中,主要需要参考的有两点:
1,相对定位
请注意,相对定位并没有脱离文档流,“虽然表现区脱离了原来的文本流,但是在文本流中还还有此相对定位的‘老窝’。这点要特别注意,因为在实际应用中如果相对定位的位移数值过大,那么原有的区域就会形成一块空白。”
2,绝对定位
“如果需要这个绝对定位要跟着网页移动,而并且是因定在网页的某一个固定位置。要实现这种效果基本方式就是为这个绝对定位的父级设置为相对定位或是绝对定位。那么绝对定位的坐标就会以父级为坐标起始点。” 特别需要注意的是,这里是父级块的padding左上边缘点为坐标起始点。也就是下图中的A点。
博客二:http://www.divcss5.com/rumen/r403.shtml
1,绝对定位与float浮动不能同时使用,比如一个大盒子里有的是绝对定位,有的是使用css float浮动定位,这样IE6浏览器将不会显示改大对象里的这些绝对定位与相对定位,这也算是IE6 CSS HACK吧,注意不要混用即可。
CSS中相对定位与绝对定位的更多相关文章
- css 中相对定位和绝对定位
1. css中定位机制有三种: 标准文档流, 浮动, 绝对定位 2. 绝对定位就属于第三种定位, 用到position属性, 下面就是具体设置 相对定位: 相对于自身原有位置(就是普通流的时候)进行偏 ...
- css中相对定位和绝对定位
相对定位: #box_relative { position: relative; left: 30px; top: 20px; } 绝对定位: #box_relative { position: a ...
- 详解CSS的相对定位和绝对定位
CSS的相对定位和绝对定位通常情况下,我们元素的position属性的值默认为static 就是没有定位,元素出现在正常的文档流中,,这个时候你给这个元素设置的left,right,bottom,to ...
- Web—12-详解CSS的相对定位和绝对定位
CSS的相对定位和绝对定位通常情况下,我们元素的position属性的值默认为static 就是没有定位,元素出现在正常的文档流中,,这个时候你给这个元素设置的left,right,bottom,to ...
- 详解CSS的相对定位和绝对定位(讲得很详细)
详解CSS的相对定位和绝对定位 CSS的相对定位和绝对定位通常情况下,我们元素的position属性的值默认为static 就是没有定位,元素出现在正常的文档流中,,这个时候你给这个元素设置的left ...
- css定位:相对定位、绝对定位、固定定位的区别与特性
css定位:相对定位.绝对定位.固定定位的区别与特性 原文地址:http://www.qingzhouquanzi.com/106.html css定位常用的有以下三种: 使用了定位的共同特性: 这三 ...
- 详细讲解CSS中相对定位relative和绝对定位absolute
很多朋友问过我absolute与relative怎么区分,怎么用?我们都知道absolute是绝对 定位,relative是相对定位,但是这个绝对与相对是什么意思呢?绝对是什么地方的绝对,相对又是相对 ...
- h5整理--详解css的相对定位和绝对定位
浏览器默认状态下position的属性默认值是static也就是没有定位,元素出现在正常的文档流中,这个时候给元素设置的left,right.bottom.top这些偏移属性是没有效果的,不会生效: ...
- css position相对定位与绝对定位彻底搞懂
定位position position本身就有给...定位的意思 position属性的值: static ---默认值 relative ---相对定位 absolute ---绝对定位 fixed ...
随机推荐
- quick lua 3.3常用方法和学习技巧之transition.lua
transition.lua主要是动作相关的操作. -------------------------------- -- @module transition --[[-- 为图像创造效果 ]] l ...
- 今日随笔:scrollTop与overflow
今天想写一个页面一加载滚动条就自动滚到底部的效果,结果在IE上实现成功了,chrome上完全没反应,最后测试了一下,居然是因为css文件中,html,body都写了overflow:auto这一语句, ...
- CentOS 7下关于systemd的一些唠叨话一:systemd的特点和使用
摘要 近年来,Linux 系统的 init 进程经历了两次重大的演进,传统的 sysvinit 已经逐渐淡出历史舞台,新的 UpStart 和 systemd 各有特点,越来越多的 Linux 发行版 ...
- Cheatsheet: 2015 09.01 ~ 09.30
Web A Guide to Vanilla Ajax Without jQuery Gulp for Beginners A Detailed Walkthrough of ASP.net MVC ...
- linux 修改home目录下的中文目录名为英文
编辑home/下的 .config/user-dirs.dirs,把所有的中文名称修改为英文名称 在home目录下创建对应的英文名称路径 运行 xdg-user-dirs-update 重启机器
- Servlet 实现上传文件以及同时,写入xml格式文件和上传
package com.isoftstone.eply.servlet; import java.io.BufferedReader; import java.io.BufferedWriter; i ...
- 解决 scroll() position:fixed 抖动、导航菜单固定头部(底部)跟随屏幕滚动
一.导航栏或者页脚正常情况下固定在页面的相应位置,当页面滚动后,导航栏或者页脚固定在页面的顶部或者底部的情景 一般就是将该块的代码样式的position设置为fixed.固定在顶部的话,将top设置为 ...
- PHP中的变量详解
php变量通过名只能我们就知道首先变量,是在程序执行期间,可以变化的量. 1.那变量是干嘛的呢,用变量就可以来保存我们值,这就是变量,那么我们接着来看,知道了变量是什么,以及它能干什么,我们再来看一下 ...
- 用substr()截取中文出现乱码的解决方法
截取中文字符串时出现乱码(使用substr()函数) 程序一:PHP截取中文字符串方法 function msubstr($str, $start, $len) { $tmpstr = &quo ...
- Cryptopp iOS 使用 RSA加密解密和签名验证签名
Cryptopp 是一个c++写的功能完善的密码学工具,类似于openssl 官网:https://www.cryptopp.com 以下主要演示Cryptopp 在iOS上的RSA加密解密签名与验证 ...