浮动元素撑起父级元素
来源:互联网 发布:意大利语发音软件 编辑:程序博客网 时间:2024/04/20 05:04
浮动会使元素脱离文档流,如果不设置父级高度,父级将失去高度,影响页面布局。这里总结了一些常用的方法,是父级“有高度”。
1. 设置父级高度
设置一个合适的高度,这种方法比较适用于元素高度固定的场景。
2. 设置父级元素"overflow: hidden;"
这种方法比较简单,但要确保父级元素没有溢出样式。
3. 设置父级浮动
让父级标签也跟着浮动,但是父级元素也将脱离文档流。
4. 添加一个子元素,清除浮动“clear: both;”
在最后一个浮动元素后面添加一个空的块级元素,清除浮动
5. 使用:after伪元素选择器,选择父级,改方法同方法4相似
.father:after{ content:""; height:0; visibility:hidden; display:block; clear:both; }
阅读全文
0 0
- 浮动元素撑起父级元素
- 元素浮动
- 闭合浮动元素”或“清除浮动元素
- 元素浮动与浮动清除
- 浮动元素(float)
- 窗口浮动元素
- 浮动元素(float)
- html浮动元素
- css:float浮动元素
- 浮动元素居中显示
- 闭合浮动元素
- 浮动元素问题
- 居中一个浮动元素
- 浮动元素居中
- 浮动框架iframe元素
- 内联元素实现浮动
- 浮动元素排列规则
- 父元素清除浮动
- python几种括号表示的类型
- 1542:买房子
- 项目管理实践之版本控制工具SVN在Windows平台下的平台搭建
- notepad++ json格式化
- Maven学习一:使用Myeclipse创建Maven项目
- 浮动元素撑起父级元素
- 大数据社区版 jdk,ssh安装
- FreeCodeCamp <Basic Javascript>
- classloader工作机制
- Linux:文件权限构成与修改
- nodejs 构建本地web测试服务器 以及 解决访问静态资源的问题!有完整源码!
- PHP--简单的自定义新建文件打印
- ios开发证书,描述文件,bundle ID的关系
- 分布式系统设计的求生之路