绝对定位:子元素进行了绝对定位会不会跳出父级元素。

   绝对定位(position:absolute)

      根据前天所学,给某个元素进行绝对定位后,如果没有相近的拥有定位属性的父级元素,那么它就定位就是跟据整个document来定位,而且脱离了文档流。

      假设:一个div里包含了一个span标签,只对span标签进行绝对定位,让它跑到div块的外面去,看看是否能成功。

<span style="font-size:18px;">  代码: <div><span></span></div></span>

  

给它加个样式:

body{
       margin:0;
}
div{
     width:200px;
     height:200px;
     background:black;
     margin:50px auto;
}
span{
    width:50px;
    height:50px;
    background:red;
    position:absolute;
    left:10px;
    top:10px;
  
}

经在编辑器里测试,结果是:span标签跳脱了div,根据html进行了定位。答案是会。

注意点一:如果对span只加了绝对定位属性,而没有写具体的像素和方向,那么span标签仍然在父级左上角。

并且会显示出来。如果没加定位属性,div内的span是看不到了,因为是行内元素无法定义宽高,审查元素显示0*0。


  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值