美文网首页
DOM元素relative定位产生空白

DOM元素relative定位产生空白

作者: 黄金原野 | 来源:发表于2020-07-16 10:51 被阅读0次

在使用relative定位时,由于元素与它本来应该存在的位置发生偏移,导致原本的位置出现空白,这些空白不会自动消除。

解决方案
将该元素的父元素设置为relative定位,当前元素使用absolute定位。

为什么父元素要relative
因为relative的参照元素是最近的包含定位的父级元素,这个父级元素可能是父元素,也可能是祖元素

相关文章

  • DOM元素relative定位产生空白

    在使用relative定位时,由于元素与它本来应该存在的位置发生偏移,导致原本的位置出现空白,这些空白不会自动消除...

  • 8.CSS布局篇之定位

    absolute和relative定位 relative依据自身定位,不影响其他元素 absolute依据最近一层...

  • 子元素相对于父元素的绝对定位

    1、参照定位的元素必须是相对定位元素的父元素 2、参照定位的元素必须加入position:relative; 3、...

  • 九、定位

    1、定位 position定位,用来改变页面中元素的位置 1,相对定位 relative; 相对定位的元素框会偏移...

  • DIV+CSS布局2

    布局相关属性: 定位方式 —— position:relative(正常定位)absolute(根据父元素进行定位...

  • 关于html的position定位问题

    参考文档:MDN relative 当元素被设置为relative属性后,相对于该元素的原位置进行定位。 该元素的...

  • CSS-position-relative/absolute/f

    absolute、relative与浮动float三者的区别 relative相对定位 将定位元素不偏离正常文档流...

  • 定位

    什么是定位? 可以随意改变元素的位置,分为(相对定位position:relative,绝对定位position:...

  • CSS定位与布局

    1、定位 CSS position relative:(1) 相对定位会按照元素的原始位置对该元素进行移动。(2)...

  • 2015年11月4日

    position:relative; 相对定位a、不影响元素本身的特性;b、不使元素脱离文档流;c、如果没有定位...

网友评论

      本文标题:DOM元素relative定位产生空白

      本文链接:https://www.haomeiwen.com/subject/puxphktx.html