【css】居中对齐方法


1、text-align: center——水平居中

仅对文字、图片、按钮等行内元素有效(display设置为inline或inline-block等)进行水平居中

2、margin: 垂直 auto——水平居中

仅水平居中,且对浮动元素无效

3、line-height——垂直居中

line-height=height,仅对一行文字有效

4、使用表格——水平、垂直居中

对 td / th 的 align='center' 和 valign='middle' 两属性可以水平和垂直集中

5、弹性布局——水平、垂直居中

display: flex;

justity-content: center;

align-items: center;

6、使用display: table-cell——水平、垂直居中

对于那些不是表格的元素,我们可以通过display: table-cell来把它模拟成一个表格单元格

7、子绝父相——水平、垂直居中

子元素设置为absolute,父元素设置为relative(当知道子元素的宽高)


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM