首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >使中文文本大20%

使中文文本大20%
EN

Stack Overflow用户
提问于 2014-03-21 16:14:35
回答 1查看 257关注 0票数 0

我正在写一个HTML文档,其中混合了中英文文本。中文不是我的第一语言,所以我更喜欢中文文本比平常大一点,这样我就能清楚地看到笔画。我正试图对文件进行样式化以实现这一点。

明显的CSS解决方案:

代码语言:javascript
复制
:lang(zh-Hans) {font-size: 1.2em;}

问题就不那么明显了。在每个嵌套元素(任何类型)中,字体大小再乘以20%。在下面的例子中,每个中文句子都比前面的句子大。

代码语言:javascript
复制
<html>
  <head>
    <style type="text/css">
      :lang(zh-Hans) {font-size: 1.2em;} 
    </style>
  </head>
  <body>
    <div lang="zh-Hans">
      我不懂。
      <span>我不懂。</span>
      <span><span>我不懂。</span></span>
    </div>
  </body>
</html>

我可以切换到绝对尺寸:

代码语言:javascript
复制
:lang(zh-Hans) {font-size: 20px;}

但这使得所有中文文本的大小相同,因此,例如,标题不再比正文文本大。

有可能的解决办法。我可以重构我的文档,以便语言标记总是应用于最嵌套的元素。或者,我可以为中文文本可能出现的所有上下文添加大量CSS规则。但这是我想避免的工作。

是否可以在不增加嵌套元素组合的情况下对语言标记的文本应用相对字体大小的增加?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2014-03-21 17:00:58

级联em是一个非常恼人的问题,幸运的是,它有一个简单的现代解决方案:根em (rem)。

CSS魔法师有这样的说法

使用"em“作为字体大小的问题之一是,它们是级联的,因此您将永远编写选择嵌套元素以将其重置为1em的规则;CSS3现在有rem (”根em")来防止这个问题。只要声明一个px回退,你今天就可以使用它了。

有关血淋淋的细节,请查看CSS3规范

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/22563928

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档