前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >一次关于line-height 属性失效的问题排查

一次关于line-height 属性失效的问题排查

作者头像
星宇大前端
发布2023-05-26 16:42:01
3000
发布2023-05-26 16:42:01
举报
文章被收录于专栏:大宇笔记大宇笔记

今天同事说了一个问题,一个web 工程里突然样式竖直方向不居中了全部失效,我帮忙看了下。结果看了一个小时也没有解决,最后猜出来的,反向推出原因,记录一下。

问题

一直运行的项目突然样式失效,竖直方向不居中了。

排查

居中的样式是靠line-height 生效的,现在样式什么的都没变。考虑是全局样式影响。

但是这个lineHeight 是行内样式,优先级最高应该 不会有东西影响。陷入纠结和尝试中。

最后对比发现,提交代码中 htmlDOCTYPE 被修改。

原因分析

新提交代码加上了这句话:

代码语言:javascript
复制
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
在这里插入图片描述
在这里插入图片描述

DOCTYPE 可以点击看百度百科了解。

新增这句话摒弃了font ,所以lineHeight 没有生效,所以样式没有居中。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2023-05-22,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 问题
  • 排查
  • 原因分析
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档