生活指南——让生活变得更简单

相对定位和绝对定位的区别及特点_相对定位和绝对定位的区别

课程:

绝对定位和相对定位的区别是什么

绝对定位(absolute):设置了绝对定位的标签会脱离文档流,以浏览器客户端的左顶点进行位置偏移

相对定位(relative):设置了相对定位的标签会保留标签原来的位置空间,以标签自身的左顶点进行位置偏移

以上就是两者的区别,这个知识点是我在传智播客学习PHP的时候学到的,你可以看一下他们的基础视频,这些知识点都有的。

能否解释一下绝对定位和相对定位的区别

绝对定位其实也可以说是相对定位,只不过它相对的参考对象为文档区域的左上角,而相对定位则是相对于当前对象的父对象。如果相对定位的对象的父对象是body,并且body的margin属性为0,则可以认为这时的相对定位的对象和绝对定位的对象在定位上是等同的。 具体步骤:1.定位效果相同时的情况。 stylebody{margin:0}/stylediv�0�2style="width:200;height:200;border:1px�0�2solid�0�2#000000; background:#dedede;position:absolute;left:50;top:30"/div div�0�2style="width:150;height:150;border:1px�0�2solid�0�2#666666; background:#eeeeee;position:relative;left:50;top:30"/div 2.父对象不是body时的情况 div�0�2align="right" div�0�2style="width:200;height:200;border:1px�0�2solid�0�2#000000; background:#dedede;position:absolute;left:50;top:30"/div div�0�2style="width:150;height:150;border:1px�0�2solid�0�2#666666; background:#eeeeee;position:relative;left:50;top:30"/div/div技巧:在绝对定位时如果没有left,right,top,bottom等属性,则对象相当于相对定位,这样的对象同时具有绝对定位和相对定位的优点。 特别提示图2.1.4.1为本例第一段代码的运行效果,可以看到,绝对定位的层和相对定位的层的定位是一样的,坐标一点,出现的位置就一样。图2.1.4.2为第二段代码的运行效果,可以看到,相对定位的层的坐标值是相对于其父对象(居右对齐的DIV元素),而绝对定位的坐标仍然是相对于文档区域的左上角。 图2.1.4.1�0�2两种定位效果相同时的情况 图2.1.4.2�0�2两种定位的层的明显区别 特别说明绝对定位一般用于可拖动对象,因为只有position的值为absolute的对象才可在客户端用脚本动态控制其定位。相对定位用于制作导航的下拉菜单居多,因为没有绝对定位产生的分辨率问题。控制对象是绝对定位还是相对定位,主要在于position属性的取值,它的取值及说明如表2.1.4.1所示。 表2.1.4.1�0�2position属性的可选值可选值说明static无特殊定位,对象遵循HTML定位规则(默认值)。 absolute将对象从文档流中拖出,使用�0�2left�0�2,�0�2right�0�2,�0�2top�0�2,�0�2bottom�0�2等属性相对于其最接近的一个最有定位设置的父对象进行绝对定位。如果不存在这样的父对象,则依据�0�2body�0�2对象。而其层叠通过�0�2z-index�0�2属性定义。

绝对位置和相对位置的区别

相对地址:

相对地址就是说地址是相对存在的,他往往值表现一个网址后面的部分,不带有域名,如:/htm/shopjsp/cpys.html 当我们有多个域名的时候,对相关的URL使用相对的地址是非常有效的,这样可以保证每一个域名都能够准确的到达相应的页面。但是相对地址也有一定的缺陷,那就是不能保证内容的原创度。当有人来复制我们的内容的时候,很多的时候会把内链一起复制,这个时候我们使用的相对地址就会变成对方的地址了。如对方的站B,那么这个时候URL就会变成B/:/htm/shopjsp/cpys.html 所以说相对地址对网站的版权保护不是很有效。

绝对地址:

绝对地址也可以说是一种物理路径,也就是一条完整额路径,学过编程的朋友也都知道,绝对地址还能够提升打开的速度。绝对地址如:,这样就是一个绝对的网站地址,他能够准确的表达我们要去访问的是哪一个页面。

绝对路径有很多的优势,但是对于不同的网站来说有有一定的劣势。有的网站可能因为改版等多种原因造成了网站域名的变更,这样我们使用的绝对地址就全部变成了死链接了。因此对于不同的网站采用哪种URL途经还是需要肯局具体的情况考察的。

绝对地址可以保证我们网站的唯一性,当有人采集我们网站内容的时候,那么就会把我们的地址同样采集走,这样就相当于免费做了一个锚链了。同样绝对地址又能够保证域名的规范。但是针对于每一个网站来说,不可能永远的保持一致,肯定会有改版甚至是换域名的一天,因此我们在选择使用绝对地址还是相对地址的时候,一定要考虑到自身网站的发展才行。

绝对定位和相对定位有什么区别?

相对定位是普通流定位,相对定位的元素出现在它在普通流该出现的位置,普通流你可理解为文档流就行了。这个占空间的。例子:

内容1

内容2

内容3

现在这个就是内容4的位置,比如内容4是相对定位的,他就该出现在内容4这个位置。就是说这个位置是它的起点,如果将top设为40px那他就出先在它该出现的位置(内容4)顶部以下40px的地方。(我说的是上下排,你也可以想到左右排。一样的),相对位置是占空间的,因此移动他会覆盖其他框。

绝对定位它的位置和文档流无关且不占空间,这样普通流中的其他元素的布局(比如代码里内容4是绝对定位的)将内容4当做不存在,将内容5出现在内容4的位置,那么内容4呢?其相对最近以定位的父元素,这里说的内容4的父即body(dw里的层就是这个东西了,有些人就这样弄,结果浏览器尺寸变了,位置就不对了),正确的做法:绝对定位的元素它应在在一个父元素里,这个父元素须是有定位的且有布局(给个高度就可以了),用相对定位为例,

div style="position:relative;height:100px;"

div style="position:absolute;top:20px;"/div

/div

现在这个绝对定位的元相对他的父元素定位的了;

注意这个只在ie6.0以上才会相对他的父元素定位,其他浏览器也没问题,要在ie5.0以下这样,还须写些东西才可以,不写了,你自己慢慢研究吧。

css中的绝对定位和相对定位有什么区别?

css中的绝对定位和相对定位的区别:

position: absolute,绝对定位。position: relative,相对定位。

position:absolute,float会隐式地改变display的类型(display:none除外)。即是当元素设置position:absolute、float:left、float:right中任意一个时,都会让元素以display:inline-block的方式显示(特点是:可以设置长宽,默认宽度不占满父元素)。

CSS:

层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。

div的相对定位和绝对定位是什么意思,什么区别啊?

相对定位和绝对定位是定位的两种表现形式,区别如下:

一、主体不同

1、相对定位:是设置为相对定位的元素框会偏移某个距离。

2、绝对定位:absolute 脱离文档流,通过 top,bottom,left,right 定位。

二、特点不同

1、相对定位:在使用相对定位时,无论是否进行移动,元素仍然占据原来的空间。因此,移动元素会导致它覆盖其它框。

2、绝对定位:选取其最近的父级定位元素,当父级 position 为 static 时,absolute元素将以body坐标原点进行定位,可以通过z-index进行层次分级。

三、表现方式不同

1、相对定位:对一个元素进行相对定位,它将出现在它所在的位置上。可以通过设置垂直或水平位置,让这个元素“相对于”它的起点进行移动。

2、绝对定位:文本流中的内容会顶替绝对定位元素的位置,而绝对定位元素自然的层叠于文本流之上。而在单一的绝对定位中,定位元素将会跑到网页的左上角,因为那里是被绝对定位后的坐标原点。

参考资料来源:百度百科-CSS相对定位

参考资料来源:百度百科-绝对定位

  • 评论列表:
  •  访客
     发布于 2022-07-29 04:41:09  回复该评论
  • ive;left:50;top:30"/div/div技巧:在绝对定位时如果没有left,right,top,bottom等属性,则对象相当于相对定位,这样的对象同时具有绝对定位和相对定位的优点。特别提示图2.1.4.1为本例第一段代码的运行效果,可以看到,绝对定位的层和相对定位
  •  访客
     发布于 2022-07-29 06:55:12  回复该评论
  • 的区别是什么绝对定位(absolute):设置了绝对定位的标签会脱离文档流,以浏览器客户端的左顶点进行位置偏移相对定位(relative):设置了相对定位的标签会保留标签原来的位置空间,以标签自身的左顶点进行位置偏移以上就是两者的区别,这个知识点是我在传智播
  •  访客
     发布于 2022-07-29 02:52:17  回复该评论
  • 也没问题,要在ie5.0以下这样,还须写些东西才可以,不写了,你自己慢慢研究吧。css中的绝对定位和相对定位有什么区别?css中的绝对定位和相对定位的区别:position: absol
  •  访客
     发布于 2022-07-29 02:50:50  回复该评论
  • 证每一个域名都能够准确的到达相应的页面。但是相对地址也有一定的缺陷,那就是不能保证内容的原创度。当有人来复制我们的内容的时候,很多的时候会把内链一起复制,这个时
  •  访客
     发布于 2022-07-29 11:11:30  回复该评论
  • 课程:1、绝对定位和相对定位的区别是什么2、能否解释一下绝对定位和相对定位的区别3、绝对位置和相对位置的区别4、绝对定位和相对定位有什么区别?5、css中的绝对定位和相对定位有什么区别?6、div的相对定位和绝对定位是什

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

Copyright Your WebSite.Some Rights Reserved.