【问题标题】:CSS reduce inline font-size that is set in pxCSS 减少以 px 为单位的内联字体大小
【发布时间】:2015-03-29 20:08:25
【问题描述】:

以下问题:我有一个网站,其字体大小设置为 px,内联样式。

是否有可能在调整大小时调整字体大小(例如在媒体查询中),让我们说 fontsize*0.6

如果设置了 style="font-size: 24px" 和 style="font-size:60px" 我可以将值乘以 0.6 以减小移动设备上的字体大小?

可以是 jQuery 或 CSS 解决方案。

提前致谢

【问题讨论】:

  • 尝试使用vw 单位 - 它会将字体大小与视口的宽度联系起来
  • 我认为您需要考虑使用 em 而不是 px - 本文描述了它们的工作原理。然后在您的媒体查询中,您可以使用它们。 teachingmultimedia.com/mmp240/HowMuchIsThatEm.html
  • 如果尺寸都是这样设置的,您可以简单地访问元素的.style.fontSize 属性并修改它们的值。这应该是相当简单的。这是否有意义是一个不同的问题。您是否测试过这些页面在移动设备上确实存在问题,并且特定的字体缩小确实可以解决,甚至解决它?
  • 我知道这没有多大意义,但是这就是网站的编码方式:) 感谢 style.fontSize 的提示

标签: jquery css media-queries font-size


【解决方案1】:

为什么不为所有断点指定字体使用CSS3 @media Query

这是我的解决方案:

@media screen and (max-width: 300px) {
    body {
        font-size: 18px;
    }
}


@media screen and (min-width: 600px) {
    body {
        font-size: 50px;
    }
}

【讨论】:

  • 我不确定这是 OP 的要求 - “我可以将值乘以 0.6 以减小移动设备上的字体大小?”是这里的问题。请不要使用!important
猜你喜欢
  • 1970-01-01
  • 2015-11-22
  • 2016-11-23
  • 1970-01-01
  • 1970-01-01
  • 2013-11-19
  • 2016-07-11
  • 2015-04-20
  • 2010-11-06
相关资源
最近更新 更多