CSS06-元素显示模式、单行文字垂直居中

一、什么是元素显示模式

1-1、块级元素

1-2、行内元素

1-3、行内块元素

1-4、小结

二、元素显示模式转换

三、单行文字垂直居中

CSS 没有给我们提供文字垂直居中的代码,这里我们可以使用一个小技巧来实现。

解决方案: 让文字的行高等于盒子的高度,就可以让文字在当前盒子内垂直居中。

3-1、单行文字垂直居中的原理

是如果行高小于盒子高度,文字会偏上;

如果行高大于盒子高度,则文字偏下。

相关推荐
用户059540174465 小时前
把AI对话记忆存储测试从手工改成Playwright+pytest,覆盖率从20%提到96%,回归时间缩短90%
前端·css
醉城夜风~10 小时前
CSS盒模型(Box Model)
前端·css
呼噜想睡觉10 小时前
Flex弹性布局
css·html·css3
用户0595401744616 小时前
「记仇」记忆存储测试踩坑实录:用 Pytest+Docker 把 BUG 扼杀在凌晨 3 点前
前端·css
郑板桥3016 小时前
前端周刊 | 第 42 期:Rspack 2.0 破局、cdnjs 全量上云、CSS 交错动画入基线(2026.07.28 - 08.03)
前端·css
NutShell Wang16 小时前
渐变刚甩掉「灰廊」,就被 OKLCH 裁出硬边:sRGB / HSL / OKLCH 三条插值路径的实测复盘
前端·css·vibe coding
用户059540174461 天前
Redis 记忆存储踩坑实录:一个并发写入 Bug 让我排查了 4 小时
前端·css
10WTW011 天前
Sprite-Motion-Lab:雪碧图动画编辑器
前端·css·雪碧图·spritemotionlab·10wtw01
醉城夜风~2 天前
CSS元素显示模式(display)
前端·css
开普勒chr2 天前
css样式diaplay:"contents"的妙用
css