HTML中是否脱离文档流

       我们在显示隐藏元素的时候经常会用到把display设置为none,设置为none效果很明显,就是让元素脱离文档流,不显示,不占文档空间。


定位:

inhert:规定从父元素继承position属性的值。
static:默认值,没有定位,元素出现在正常的流中。
relative:无论元素是否移动,元素在文档流中占据原来空间,只是表现会改变。
absolute:绝对定位使元素的位置与文档流无关,也不占据文档流空间,普通流中的元素布局就像绝对定位元素不存在一样。由于绝对定位和文档流无关,所以绝对定位的元素可以覆盖页面上的其它元素,可以通过z-index属性控制叠放顺序。
fixed:不包含普通文档流中。


浮动:

          浮动的框可以左右移动,直到它的外边框碰到包含框或者另一个浮动元素的框的边缘。浮动元素不在文档的普通流中,文档的普通流中的元素表现的就像浮动元素不存在一样。

         如果浮动的元素后有一个文档流中元素,那么这个元素的框会表现的像浮动元素不存在,但是框的文本内容会受到浮动元素的影响,会移动以留出空间。该特性经常会被用在是文字围绕图片上。当图片不浮动时,文字就会换行出现在下面;当图片浮动时,文字围绕着图片。用术语说就是浮动元素旁边的行框被缩短,从而给浮动元素留出空间,因而行框围绕浮动框。

        要想阻止行框围绕在浮动元素外边,可以使用clear属性。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值