摘要：居中水平居中对于子元素是行内元素或者时使用父元素宽度无论确定不确定均可实现相对于父元素水平居中。
居中 水平居中
对于子元素是行内元素(或者inline-block)时使用text-aling: center; ,父元素宽度无论确定不确定,均可实现相对于父元素水平居中。
对于子元素时块级元素时，使用外边距设置进行水平居中
效果和上图一样
垂直居中块级元素里的文字垂直居中
对于块级元素来说，它的高度在没有显示设置的情况下，是由子元素高度撑开的，所以对于子元素是内联元素的可以采取对父元素进行设置padding来进行垂直居中
水平垂直居中aaaaaaaaaaaaaaaaaafaddadfadfadfadfdfadfadfadfdfadafadfagadgadfadferew
子元素宽高确定
使用子元素margin进行居中
子元素宽高不确定
使用定位加margin 居中
使用transform 来实现居中
当子元素是一个图片时,父元素使用text-align:center; 子元素设置vertical-align: middle;，且用父元素的伪元素等同父元素高度后设置为vertical-align:middle;
对父元素设置为table-cell来实现居中，需要设置宽高
flex 布局，使用主轴和侧轴的对齐方式来实现居中
如有错漏，欢迎指正。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/113181.html
摘要：高度模型浅识为的简写，简称为块级格式化上下文，为浏览器渲染某一区域的机制，中只有和中还增加了和。并非所有的布局都会在开发中使用，但是其中也会涉及一些知识点。然而在不同的纯制作各种图形纯制作各种图形多图预警 一劳永逸的搞定 flex 布局 寻根溯源话布局 一切都始于这样一个问题：怎样通过 CSS 简单而优雅的实现水平、垂直同时居中。记得刚开始学习 CSS 的时候，看到 float 属性不...
摘要：内容无法撑开父级容器表格容器居中使用场景容器内容居中，并不想脱离文档流。缺点不适用于弹层这种盖住页面内容的布局使用和垂直居中值等于元素高度的值使用场景一个容器内部的当韩文字居中优点内容宽高，容器宽高均不用。 以前前端面试基础问题的时候经常会被问到这个问题：但是从来没有做过这样的总结，网上很多人总结的很多，很好。自己干了这么多年，这个问题使用场景还是蛮多的，还是自己总结一下吧（不断更新）...
阅读 808·2019-08-30 15:55
阅读 3296·2019-08-30 13:10
阅读 1154·2019-08-29 18:45
阅读 2213·2019-08-29 16:25
阅读 1993·2019-08-29 15:13
阅读 2235·2019-08-29 11:29
阅读 419·2019-08-26 17:34
阅读 1352·2019-08-26 13:57
