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 ...
随机推荐
- 如何通过iframe以post方式提交form表单
以前用过一次这种技术,这次用居然忘了,现纪录下来,下次再用就来看看. 首先在html中需要准备好form和iframe元素代码如下: <form id="speaker_form&qu ...
- 【Java】聊聊常用的非对称加密算法之一RSA的使用(Java)
参考的优秀文章 Java加密技术(四)——非对称加密算法RSA RSA算法原理(一).RSA算法原理(二) RSA的公钥和私钥到底哪个才是用来加密和哪个用来解密? 简单的介绍 RSA是有名的非对称加密 ...
- JavaIO总结
Java IO流分为字节流和字符流 下面首先介绍一下字节流 /** * 字节流测试 * @author hc * */ public class Test { public static void m ...
- EasyUI关于 numberbox,combobox,validatebox 的几个小问题
在最近的项目中,首次使用到了 网页的一个布局框架——EasyUI,感觉这个框架特别牛,兼容性很不错,页面效果也挺不错,可是在使用标题上三个控件过程中遇到几个很奇特的问题,让我头疼不已,所以在此给广大I ...
- winform开发框架之模块维护
前言:模块维护试图解决的问题, 模块加载只用MEF的方式: MEF(Managed Extensibility Framework)是一个用于创建可扩展的轻型应用程序的库. 应用程序开发人员可利用该库 ...
- 用流从一个指定的网址抓取html代码
package cn.bdqn.collect.test; import java.io.BufferedReader; import java.io.InputStream; import java ...
- python走起之第四话
本节大纲: 一:双层装饰器:一个函数可以被多层装饰器进行装饰,函数渲染(编译)从下到上,函数执行从上到下.如下程序: 1 #!/usr/bin/env python 2 #-*-coding:utf- ...
- day5 -指针
指针和指针变量 指针就是地址,地址就是指针 地址就是存放单元的编号 指针变量是存放地址的变量 指针和指针变量是两个不同的概念,但是要注意,通常我们叙述时会把指针变量简称为指针,实际他们含义并不一样 指 ...
- iOS 二维数组排序小算法
NSArray *tmp = @[@[@(1), @(2), @(3), @(4), @(5)], @[@(6), @(7), @(8), @(9), @(10 ...
- Ggoogle Protocol Buffer的使用 (基于C++语言)
首先说明的是Protocol Buffle是灵活高效的.它的一个很好的优点(很重要的,我认为)就是后向兼容性--当我们扩展了了.proto文件后,我们照样可以用它来读取之前生成的文件. 之前已经写了关 ...