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

一、什么是元素显示模式

1-1、块级元素

1-2、行内元素

1-3、行内块元素

1-4、小结

二、元素显示模式转换

三、单行文字垂直居中

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

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

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

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

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

相关推荐
雪碧聊技术15 小时前
Vue + Element Plus 实现文本溢出显示省略号及悬浮提示
前端·javascript·css·vue.js·文本溢出省略
小妖66616 小时前
设置了 box-sizing: border-box; 不管用,下边框还是被挤压没了
前端·css·html
柚yuzumi18 小时前
CSS 定位布局:让元素各就各位
前端·css
用户0595401744618 小时前
Qdrant 召回不一致踩坑实录:跑了 300 次测试才发现是索引没刷新
前端·css
用户059540174461 天前
AI Agent 上下文污染踩坑实录:用 pytest + Redis 揪出 3 类记忆串号 bug,排查 6 小时
前端·css
—Qeyser2 天前
html 可视化海报模板编辑器
css·html·js
我命由我123452 天前
CesiumJS 笔记 - 获取容器中心点、Cartesian3 clone 方法、修改 Cartesian3 对象的高度
前端·javascript·css·前端框架·html·html5·js
FFF_634560233 天前
简单的画板小工具,下载即用
前端·javascript·css
绝世唐门三哥3 天前
CSS 虚线下划线用法指南:text-decoration 完整解析
前端·javascript·css
DsirNg3 天前
用一个登录卡片讲清 CSS 盒模型:padding、border 与 box-sizing 到底如何影响布局
css·padding·box-sizing·表单布局·border·css 盒模型·登录卡片