CSS中文字体意外下沉问题

我在写一个移动端导航列表的时候遇到了这个奇怪的问题,

先上问题吧图片描述

我的高亮热无法与导航中的热进行一个对齐,而所有的英文都是可以正常对齐,只有这一个中文有问题

我的结构是这样的,所有的Li都是循环渲染出来的,内部的字符是导航中的,span包裹的是高亮
图片描述

接下来是样式

图片描述图片描述

非常的奇怪就在于只有中文有这个问题,在不修改任何样式的情况下,只要我把热字(导航中的热)改成任意英文 问题立马就解决了(直接在开发者工具修改HTML)

图片描述

所以各位能不能给点思路,应该不太可能是中英文基线不同的问题吧,差异不该这么大

阅读 2.7k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题