原文:绝对定位和浮动的区别和运用

当一个元素使用绝对定位后,它的位置将依据浏览器左上角开始计算或相对于父容器 在父容器使用相对定位时 。 绝对定位使元素脱离文档流,因此不占据空间。普通文档流中元素的布局就当绝对定位的元素不存在时一样。因为绝对定位的框与文档流无关,所以它们可以覆盖页面上的其他元素。 而浮动元素的定位还是基于正常的文档流,然后从文档流中抽出并尽可能远的移动至左侧或者右侧。文字内容会围绕在浮动元素周围。当一个元素从正常 ...

2017-02-19 21:53 0 1264 推荐指数:

查看详情

浮动和绝对定位区别

先看看w3c关于浮动float和绝对定位absolute的讲解: float:浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止。由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样。 absolute:设置为绝对定位的元素框从文档流完 ...

Wed Jan 07 20:27:00 CST 2015 0 3435
css 浮动 相对定位 绝对定位区别

  今天下班在地铁上看了一个样式教学视频,因为最近在学习前端。以前刚毕业的时候,感觉后台才是王道,但最近发现,前端也很重要,比如:自己接一些私单做的时候,自己要根据需求做好界面,才能更加符合客户需求, ...

Wed Mar 09 06:17:00 CST 2016 0 5709
浮动定位

  浮动定位在网页设计中应用得很广泛,是两种主要布局方式的实现方法。   我们知道,网页上一般来说,块标签是自上而下的一块块堆叠,行内标签则在一行内从左到右依次并排,如果所有网页的都这样机械的排列着,也太单调了,所以有没有一个东西让标签内容脱离这种文档流呢,首先就可以考虑float ...

Mon Jun 01 07:43:00 CST 2015 2 1539
浮动定位

整理下关于文档流,浮动定位及造成的影响文档流的知识点 一 文档流的概念指什么?   文档流,是指元素排版布局过程中,元素会自动从左到右,从上往下的流式排列。并最终窗体自上而下分成一行行,并在每行中按从左到右的顺序排放元素。脱离文档流即是元素打乱了这个排列,或是从排版中拿走 ...

Sat Jan 07 03:31:00 CST 2017 0 2792
CSS中的浮动定位

在了解CSS中的浮动定位之前有必要先了解清楚标准流和脱离标准流的特性 标准流的默认特性 1、分行、块级元素,并且能够dispay转换。 2、块级元素(block):默认独占一行,不能并列显示,能够设置宽、高,宽度为父盒子的100%。例如:div、p、标题元素(h1-h6)、列表元素 ...

Tue Sep 08 18:33:00 CST 2015 0 10856
CSS浮动与绝对定位小记

浮动 float属性可以设置的值为none,left,right.对于设置了浮动的元素,会向其父元素的左侧或右侧紧靠,默认情况下,盒子的宽度不再伸展,而是根据盒子里面的内容来确定。浮动可以让一个元素移到它所在行的某一边,使得其他内容沿着该元素的边缘向下流。 浮动的盒子会脱离文档流 ...

Wed Dec 10 04:09:00 CST 2014 5 1186
css 浮动定位

1.css float CSS float 属性定义元素在哪个方向浮动浮动元素会生成一个块级框,直到该块级框的外边缘碰到包含框或者其他的浮动框为止。 1)元素怎样浮动 元素的水平方向浮动,意味着元素只能左右移动而不能上下移动。 一个浮动元素会尽量向左或向右移动,直到它的外边缘碰到包含 ...

Fri May 31 17:55:00 CST 2019 0 1087
【前端】浮动定位

浮动定位 浮动 什么是浮动? ​ 元素的浮动是指设置了浮动属性的元素会脱离标准普通流的控制,移动到其父元素中指定位置的过程。它可以让任何盒子可以在一行排列,用浮动来布局。 ​ 在css中,通过float属性来定义浮动,其基本语法格式如下: 属性值 ...

Sun Aug 18 00:10:00 CST 2019 0 1169
 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM