【问题标题】:How to set em to 10px for complete website如何将 em 设置为 10px 以获得完整的网站
【发布时间】:2014-05-29 08:50:51
【问题描述】:

我正在为响应式网站创建一个模板。我了解到 em 非常适合用于响应式设计。 但问题是我将正文字体大小设置为 62.5%,但是当我使用 p、span 和其他元素(如 2em)时,字体大小比 2 em 与 20px 不同。根据我的默认字体大小,正文中的任何位置都应该是 2em=20px,因为 62.5% 会覆盖默认的 1em=16px 到 10px。 请建议我应该改变什么,以便每当我将任何元素的字体大小设置为 2em 时,它都会是 20px。

【问题讨论】:

    标签: html css pixel em


    【解决方案1】:

    你不能。请改用rem。它指的是根元素的字体大小。

    【讨论】:

    • 为什么我不能使用rems。我用它
    【解决方案2】:
    BODY {font-size:62.5%}
    

    这需要 16 像素到 10 像素。从现在开始,以像素为单位很容易思考,但仍以 em 为单位设置大小:1em 是 10px,0.8em 是 8px,1.6em 是 16px,等等。

    .element {  
        font-size: 20px;  
        width: 4em;  
        height: 4em;  
    } 
    

    那么这意味着元素的宽度和高度(此处定义为 4em x 4em)将计算为 80px x 80px (20px * 4 = 80px)。

    Read 1 Read 2

    【讨论】:

    • 我解决了这个问题 font-size=2em=20px 我不知道但完成了但是当我在 em 中获取保证金时,与 2em 之类的 px 不同!=20px。
    • 你可以得到详细的解释impressivewebs.com/understanding-em-units-css
    • 你提供的两个链接都很棒,在我完全了解 em 之前,我完全了解了 em 的感谢。
    • 实际上我试图支持你的答案,但我能够这样做,所以我不知道如何接受你的答案
    • 点击此帖子下方左侧的复选标记。也点赞。 (我认为它就在箭头的正下方)。
    【解决方案3】:

    这可能是您的字体大小继承自任何父标签的问题...

    【讨论】:

      【解决方案4】:

      你不能。根据定义,em 单位等于元素的字体大小,或者对于单独的 font-size 设置,等于父元素的字体大小。

      结论取决于您真正想做的事情,这从问题中不清楚。如果您想要以像素为单位的特定大小,请使用px 单位(及其所有vagueness)。如果您想要调整大小,以便您或用户可以轻松更改基本字体大小并相应地调整所有其他字体大小,请始终使用em 单位或% 单位,并适当考虑元素嵌套。例如,仅当您希望字体大小为父元素字体大小的 2 倍时才使用font-size: 2em——如果您想要不同的比例,请使用不同的值。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2018-11-07
        • 1970-01-01
        • 2012-08-18
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多