行内元素和块级元素居中
内联元素
水平居中
1、行内元素居中:设置text-align:center;
2、flex布局:设置display:flex;justify-content:center;
垂直居中
父元素高度是单行文本:设置height=line-height;
父元素确定的是多行文本:a:插入table, 然后设置vertical-align:middle;
b:先设置display:table-cell;然后设置vertical-align:middle;
块级元素
水平居中
1、定宽块级元素:设置左右margin为auto
2、不定宽块级元素:a:在元素外加入 table 标签(完整的,包括 table、tbody、tr、td),该元素写在 td 内,然后设置 margin 的值为 auto;
b:给该元素设置display:inline;
c:父元素设置postion:relative;子元素设置position:absolute;left:50%;
垂直居中
使用position:absolute
利用display:table-cell
css3新特性transform:translate(x,y);
元素的垂直居中有哪些解决方案?
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 智能桌面机器人:用.NET IoT库控制舵机并多方法播放表情
· Linux glibc自带哈希表的用例及性能测试
· 深入理解 Mybatis 分库分表执行原理
· 如何打造一个高并发系统?
· .NET Core GC压缩(compact_phase)底层原理浅谈
· 新年开篇:在本地部署DeepSeek大模型实现联网增强的AI应用
· DeepSeek火爆全网,官网宕机?本地部署一个随便玩「LLM探索」
· Janus Pro:DeepSeek 开源革新,多模态 AI 的未来
· 上周热点回顾(1.20-1.26)
· 【译】.NET 升级助手现在支持升级到集中式包管理