博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
子元素在父元素中垂直、水平居中——四种方法
阅读量:3932 次
发布时间:2019-05-23

本文共 494 字,大约阅读时间需要 1 分钟。

对父元素定位

  • 1-父子元素进行定位,对子元素绝对定位,子元素margin:auto;top:0;left:0;bottom:0;right:0;  (定位布局)
  • 2-对父元素定位,对子元素绝对定位,子元素left:50%,top:50%;margin-left:-子元素一半的宽度;margin-top: - 子元素一半的高度   (百分比布局)

 


设置父元素的dispaly方式

  • 3-父元素 display:table-cell; vertical-align:middle; 子元素变成一个内联元素display:inline-block
  • 4-父元素 display:flex; justify-content:center align-items:center,子元素自动居中  (伸缩盒布局)

 

 

                           -----------本文完-----------

 

 

转载地址:http://swxgn.baihongyu.com/

你可能感兴趣的文章
线程基础:多任务处理(15)——Fork/Join框架(要点2)
查看>>
线程基础:多任务处理(16)——Fork/Join框架(排序算法性能补充)
查看>>
线程基础:多任务处理(14)——Fork/Join框架(要点1)
查看>>
架构设计:系统存储(13)——MySQL横向拆分与业务透明化(1)
查看>>
架构设计:系统存储(14)——MySQL横向拆分与业务透明化(2)
查看>>
架构设计:系统存储(5)——MySQL数据库性能优化(1)
查看>>
架构设计:系统存储(2)——块存储方案(2)
查看>>
架构设计:系统间通信(45)——阶段性问题记录
查看>>
架构设计:系统间通信(44)——自己动手设计ESB(5)
查看>>
架构设计:系统存储(1)——块存储方案(1)
查看>>
架构设计:系统间通信(42)——自己动手设计ESB(3)
查看>>
在工作时走神的闪光
查看>>
Ajax使用注意事项
查看>>
FileChannel 专讲
查看>>
使用FileChannel下载本地文件及扩展
查看>>
linux文件权限与目录配置问题与解答(整理篇)
查看>>
linux文件与目录管理问题与回答(整理篇)
查看>>
struts1 组件模型
查看>>
java 数组笔记整理
查看>>
一般系统论的方法 读书笔记
查看>>