应修改tbl_select.css.php文件,重点调整.data td、.data th、.value等选择器的font-size、padding和line-height,并同步清理浏览器、OPcache及phpMyAdmin自身三级缓存。
phpMyAdmin 数据浏览页字体太小,改哪个 CSS 文件?
不是改 common.css.php 或全局主题文件,而是直接定位到数据浏览页专属样式:tbl_structure.css.php 和 tbl_select.css.php。这两个文件分别控制「结构」和「浏览(select)」页面的渲染,字体定义分散在多个 selector 中,改错位置只会让其他区域变形。
实操建议:
- 进入
phpmyadmin/themes/pmahomme/css/目录(若用其他主题,路径类似) - 重点修改
tbl_select.css.php—— 这是数据行、字段名、操作按钮实际渲染的样式源 - 搜索
font-size,找到类似.data, .data td, .data th、.action_links a、.value这类选择器 - 不要全局替换所有
font-size,只改明确作用于表格单元格和值显示的规则,例如:td.data, th.data { font-size: 14px !important; }
为什么改了 html { font-size } 没效果?
因为 phpMyAdmin 5.x 使用 rem 单位做响应式缩放,但 html 根字体只影响部分顶层容器(如导航栏、页签),而数据表格区域大量使用固定 px 或 em 值,且被更具体的选择器权重覆盖。强行改 html 字体反而会让按钮、分页控件等元素比例失调。
常见错误现象:
- 改完
html { font-size: 16px },数据库列表变大了,但「浏览」页的数据行依然细小 - 表格文字放大了,但「编辑」「删除」按钮文字模糊或错位
- 导出按钮、排序箭头图标消失——因图标依赖 font-size 精确匹配 FontAwesome 字体码点
如何避免放大后布局挤成一团?
单纯调大字体必然压缩行高和内边距,必须同步收紧垂直空间。关键不是“只改字体”,而是组合调整:
- 降低
td.data, th.data的padding:从默认8px改为4px或5px - 缩小
line-height:设为1.2或1.3(勿低于1.1,否则文字贴边) - 禁用表头悬停阴影和过渡动画(它们会加高):
th.data:hover { box-shadow: none; transition: none; } - 确认
$cfg['LimitChars']已设为合理值(如100),避免长文本自动换行撑高整行
改完不生效?检查这三个缓存层
phpMyAdmin 5.x 对 CSS 有三级缓存机制,漏清任意一层都会看到旧样式:
-
浏览器缓存:强制刷新(
Ctrl+Shift+R),或在 DevTools Network 面板勾选Disable cache - PHP opcode 缓存(如 OPcache):重启 PHP-FPM 或 Apache,或临时在
php.ini中设opcache.enable=0 - phpMyAdmin 自身 tmp 缓存:删除
phpmyadmin/tmp/目录下所有css_*.cache文件(注意权限,Web 用户需可写)
font-size 就以为万事大吉——结果发现按钮重叠、排序图标偏移、甚至某些字段内容被截断。字体只是表象,背后是整套 CSS 盒模型与 phpMyAdmin 固定 DOM 结构的咬合关系。php免费学习视频:立即使用
踏上前端学习之旅,开启通往精通之路!从前端基础到项目实战,循序渐进,一步一个脚印,迈向巅峰!











