HTML中三种定位relative,absolute,fixed后,盒子的百分比宽度及位置易错点

1 . 相对定位relative:顾名思义,相对定位是相对于自己的位置来进行偏移,如下图:

　　　　以盒子中心为基准,为每条边的正方向,例:

　　　　　　向右移动20px　:　　代码为left:20px;或者right:-20px;

　　　　　　向下移动20px : 代码为top:20px;或者bottom:-20px;

2 . 绝对定位:absolute

　　以其第一个定位的祖辈级盒子为标准,定位祖辈级的中心方向为正,如下图:

3 . 固定定位fixed,是独立于body标签之外的,只以网页html为基准的,其定位方式与绝对定位相似.都是以中心方向为正方向.

　　其宽度百分比也是只以html为基准的.

注: 1.如果没有对父级定位,绝对定位absolute则默认以其第一个定位的祖辈为标准.

　　2.绝对定位和相对定位的盒子,其宽度百分比是以第一个定位祖辈为基准的;默认的是以body为基准的

HTML中三种定位relative,absolute,fixed后,盒子的百分比宽度及位置易错点相关推荐

html本文框百分比定位,HTML中三种定位relative,absolute,fixed后,盒子的百分比宽度及位置易错点...
1 . 相对定位relative:顾名思义,相对定位是相对于自己的位置来进行偏移,如下图: 以盒子中心为基准,为每条边的正方向,例: 向右移动20px : 代码为left:20px;或者right:- ...
html绝对定位向下,HTML中三种定位relative,absolute,fixed使用后出现的一些问题
1 . 相对定位relative:顾名思义,相对定位是相对于自己的位置来进行偏移,如下图: 以盒子中心为基准,为每条边的正方向,例: 向右移动20px : 代码为left:20px;或者right:- ...
ios wifi 定位_iOS中三种定位方式
手机基站定位原理每个手机基站都有一个标识符,iPhone或3G iPad可以搜集周围所有收到信号的基站和它们的标识符,通过联网发送到苹果云端服务器,再由服务器根据这些基站的的位置信息查询并计算出当 ...
光复用技术中三种重要技术_颈前深蹲中横杠的精确位置和安全稳固抓握杠铃的三种方式及技术细节！！...
深蹲是健身的王牌动作,它有很多种变式,从杠铃安放的位置来看又分颈前深蹲.颈后低杠位深蹲.颈后高杠位深蹲,相比于颈后深蹲,颈前深蹲能够让你更好的维持背部直立,减轻脊柱压力,更针对大腿前侧肌肉的训练,同时 ...
第12天--css三种定位及z-index
一.css定位:position: 1.相对定位:relative 如果仅仅对当前盒子设置相对定位,那么它与原来的盒子没有任何变化只有一个作用:父相子绝的参考不要使用相对定位做压盖现象参考点:以 ...
html5边框顶格,CSS 三种定位方式以及格式化上下文详解》 html5jscss
常规流( Normal flow ) 之称之为常规流,是因为这是相对于后面的浮动和绝对定位的一个概念,浮动和绝对定位元素都脱离了当前的常规流. 在 CSS2.1中,常规流包括块框( block box ...
一键学会三种定位布局，相对定位、绝对定位、固定定位!
定位布局定位属性: position 作用: 指定元素的定位类型取值:static 默认不定位相对定位绝对定位固定定位相对定位关键字 position:relative 特点:相对不脱离文档流 ...
zynq学习03 zynq中三种实现GPIO的方式
http://m.blog.csdn.net/article/details?id=52123465 http://blog.chinaaet.com/songhuangong/p/43084 本文介 ...
Redis中三种特殊数据类型
本文来说下Redis中三种特殊数据类型文章目录 Gerspatial地理位置 Hyperloglog基数统计 Bitmap位图 Gerspatial地理位置一共 6 个命令: GEOADD GEO ...

HTML中三种定位relative,absolute,fixed后,盒子的百分比宽度及位置易错点

HTML中三种定位relative,absolute,fixed后,盒子的百分比宽度及位置易错点相关推荐

最新文章

热门文章