微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

css属性 居中怎么弄

CSS中的居中可以用于排版、布局等多种场景中,下面介绍几种实现居中的方式。

css属性 居中怎么弄

1. 水平居中

元素位置:relative;
左右margin:auto;

2. 垂直居中

元素位置:relative;
上下margin:auto;
高度height设为确定值;

3. 水平垂直居中

元素位置:relative;
上下左右margin:auto;
宽度、高度设为确定值;

4. 绝对定位水平垂直居中

元素位置:absolute;
宽度、高度设为确定值;
上下左右都为0;
左右margin:auto;

5. flex布局居中

容器设置为flex布局;
justify-content:center、align-items:center;

6. grid布局居中

容器设置为grid布局;
设置grid-template-columns和grid-template-rows;
使元素显示在正中间。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。