absolute到底相对哪里进行定位的

图片宽高100%不出现纵向滚动条

这种情况下图片超出了body的高度，出现了纵向滚动条，而且样式名为bottom的div只是定位在第一屏的最下面，而不是定位在图片的最下面，拉动滚动条就是这样的效果？

如果想让图片100%占满一屏（你不能让下面那棵树消失哦）不出现滚动条你可能会有很多方法，我这里是这样做的

img{ position:absolute; }

我们再来看下效果

现在我们达到目的了，但是为什么会这样？

body内图片宽高100%的时候会根据自身比例进行缩放，所以高度就超出了body，就出现了纵向滚动条，给图片设置absolute的目的就是让其相对于window进行定位，这样就可以了。

也就是说一个html文档中如果没有relative，那么absolute元素是相对于window进行定位的，window我的理解就是第一屏。不然为什么绝对定位之后图片乖乖的占满第一屏呢？求讨论求指教！

absolute到底相对哪里进行定位的

时间： 2024-11-09 06:11:11

absolute到底相对哪里进行定位的的相关文章

display值的作用分别是什么？relative和absolute分别是相对谁定位的？

display值的作用分别是什么? none:元素隐藏,不占据位置 block:该元素显示为块级元素 inline:默认,该元素会被显示为内联元素 inline-block:行内块元素 list-item:该元素会作为列表显示 run-in:该元素会根据上下文作为块级元素或内联元素显示 table:该元素会作为块级表格来显示 inline-table:该元素会作为内敛表格来显示 table-row:该元素会作为一个表格行来显示 table-row-group.table-header-group

【随笔】关于绝对定位absolute相对于父元素定位的问题

绝对定位absolute的官方定义: 设置为绝对定位的元素框从文档流完全删除,并相对于其包含块定位,包含块可能是文档中的另一个元素或者是初始包含块.元素原先在正常文档流中所占的空间会关闭,就好像该元素原来不存在一样.元素定位后生成一个块级框,而不论原来它在正常流中生成何种类型的框. 在官方定义中,并没有提到在什么情况下绝对定位相对于父元素定位,又在什么情况下相对于初始包含快也就是body定位? 其实很简单,当该元素设置为绝对定位absolute时,如果父元素为相对定位relative,则该元素相

css定位relative，absolute

转自http://www.cnblogs.com/Jerry-Chou/archive/2011/11/02/2233094.html 1.先解释一下文档流 就是HTML的一种机制,块元素单独占一行(比如   div),内联元素不换行(a标签,img标签): 2.几种定位方式 2.1   static HTML默认定位方法,服从文档流(flow),自适应的,不需要我们设置. 2.2 relative 相对定位,相对于自己原来的位置(参照物是自己),可以使用bottom,top,left,righ

CSS定位深入理解 完全掌握CSS定位 相对定位和绝对定位

其实前面的标准流和浮动流都很理解,就是定位不太好理解,特别是相对定位和绝对定位,很多刚开始学的同学不好区分.因此这里,小强老师和大家一起分享CSS定位的学习. 通过我们前面的学习,我们网页布局方法: 1. 标准流   (最稳定) 2. 浮动流   (float 其次) 3. 定位流    ( 稳定性最后) 定位是完全脱离标准流的一种布局方式. 其实前面的标准流和浮动流都很理解,就是定位不太好理解,特别是相对定位和绝对定位,很多刚开始学的同学不好区分.因此这里,小强老师和大家一起分享CSS定位的学

<转载>DIV+CSS position定位方法总结

如何学习DIV+CSS布局之position属性 如果用position来布局页面,父级元素的position属性必须为relative,而定位于父级内部某个位置的元素,最好用 absolute. 任何元素的默认position的属性值均是static,静态.这节课主要讲讲relative(相对)以及absolute(绝对). [DIV+CSS布局之position属性:absolute] 意思是:他的意思是绝对定位,他默认参照浏览器的左上角,配合TOP.RIGHT.BOTTOM.LEFT(下面

CSS(04) 定位

布局常用的三种:标准流.定位.浮动: 1.文档流-标准流 窗体自上而下分成一行行(元素在 (X)HTML 中的位置),并在一行行中从左到右排放元素: 2.CSS 定位 Position 属性(绝对定位.固定定位.相对定位.静态(默认)) 可以设置左右上下偏移: 绝对定位:脱离了文档流,位置是相对与父元素或者浏览器左上角(也可以理解为Body),并且父元素是设置了Position 为固定/绝对/相对,如果父元素中找不到就会以浏览器左上角为位置: 固定定位:脱离了文档流,位置是由浏览器左上角为启始点

css015 定位网页上的元素

css015 定位网页上的元素 一.   定位属性的功能 1.         四中类型的定位 Position: absolute relative fixed static a. 绝对定位 绝对定位通常单位为:px  em  percentage 绝对定位会脱离页面流,相对的是整个浏览器 如果a标签在设定了absolute relative fixed值的b标签中,那么a标签就是性对与b标签定位. b.相对定位 相对定位是相对于当前html流中的当前位置进行定位的. c. 固定定位 Back

CSS3-基于浮动的布局，响应式WEB设计，定位网页上的元素，设计打印页面的css技术

基于浮动的布局: 1.除非图片设置了宽度,否则始终应该要对浮动的图片设置一个宽度,这样可以让浏览器给其他内容腾出环绕的空间 2.当侧边栏的高度与主内容区的高度不一致的时候,可以用个margin进行调整 3.在一个非浮动元素<div>中存在一个浮动元素,当浮动元素高于元素本身的时候,内容就会溢出<div>中,解决方案如下: A:在</div>介绍之前添加一个换行,并且添加一个类<br class=”clear”/>,之后创建一个样式br.class{clear

Android 定位服务（Location-Based Services）

Android定位服务融合了GPS定位.移动通信.导航等多种技术,提供与空间位置相关的综合应用服务.近些年来,基于位置的服务发展更为迅速,涉及商务.医疗.工作和生活的各个方面,为用户提供定位.追踪和敏感区域警告等一系列服务. Android平台支持提供位置服务的API,在开发过程中主要使用LocationManager和LocationProviders对象. - LocationManager: 用来获取当前位置,追踪设备的移动路线,或设定敏感区域,在进入或离开敏感区域时设备会发出特定警报.