美文网首页
设置div相对父级元素浮动布局

设置div相对父级元素浮动布局

作者: dongzhensong | 来源:发表于2019-07-31 11:33 被阅读0次

让一个div相对父级元素浮动的话,可以将父级元素的position设置为“relative”,将需要浮动的div的position设置为“absolute”,再定位top、right、bottom和left等值。这样该div会无视其他同级元素的布局,在父级元素中绝对位置。

注意:

fixed定位是让div相对于浏览器窗口的绝对定位,实现在浏览器窗口中固定div的位置,使其不管网页滚动条的变化,始终在浏览器窗口中某一位置固定。使用这种定位后,如果不给div定义宽度,则div自动选择最小宽度。想让宽度随浏览器窗口大小变化而变化,则可以将宽度定为’100%‘。

如果使用了fixed固定div位置,最好将z-index属性设置为一个较大的值,例如9999;即将浮动的div放在最上层,以免被其他元素遮盖,出现无法显示或者无法点击的情况。

相关文章

  • 设置div相对父级元素浮动布局

    让一个div相对父级元素浮动的话,可以将父级元素的position设置为“relative”,将需要浮动的div的...

  • js瀑布流

    瀑布流布局思路: 1、css样式,图片的父级div样式设置为定位或者浮动。 2、找出图片父级元素(box)和最外元...

  • CSS浮动.清除浮动

    给父级元素设置高度 在底部添加一个空元素,清除浮动 父级div定义 overflow:hidden或者auto 为...

  • div居中

    设置子元素div 和 父级div 宽高一样使得子元素div在父级的div里面居中

  • position的absolute与fixed区别?

    absolute浮动定位是相对于父级中设置 position为relative或者absolute最近的父级元素f...

  • web前端入门到实战:CSS清除浮动的方法,通过项目解析总结

    网页布局中经常会用到float浮动,但是浮动的块级元素脱离了标准文档流,使得浮动元素的父元素没有高度,导致父级元素...

  • CSS之入门

    浮动 要善于利用浮动,浮动使得元素形成新的一致的流动方向,方便布局 设置元素浮动的常见套路:给子元素设置浮动,给父...

  • 常见的清除浮动的方法

    父级元素添加伪元素 在与浮动元素平级的最后面添加新元素 div.clear 在父级元素添加样式 overflow:...

  • overflow 与 BFC

    一. 谈谈 overflow 父元素设置 overflow:hidden; 清除浮动.如果一个元素 div 没有设...

  • 块状元素和内联元素、盒子模型

    div+css布局 表格布局 table布局 div+css布局 浮动布局 块状元素和行内元素 display:...

网友评论

      本文标题:设置div相对父级元素浮动布局

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