【问题标题】:Responsive text techniques [duplicate]响应式文本技术
【发布时间】:2018-07-27 09:02:03
【问题描述】:

除了使用media queries 之外,什么是创意responsive text 的最佳方法,我发现使用media queries 会占用太多时间,我猜会有一种替代方法会自动调整其自身大小。

h1 {
font-size: 22px;
}
<h1>Test</h1>

【问题讨论】:

  • 您可以使用 vh 和 vw 单位 - 根据视口宽度或高度的大小调整文本大小
  • 我发现当使用这种方法时,它对手机来说并不是最好的,因为当屏幕那么小时,文本变得不可读。
  • 是的,我也发现了,所以我为移动设备设置了一个 rem,然后如果我需要根据视口调整大小,我为平板电脑及更高版本添加 vw,你永远不会得到 100% 的 reposive,除非您投入时间并完成所有媒体查询
  • 谢谢皮特,我会接受你的建议。

标签: html css text responsive


【解决方案1】:

您可以使用 vwvh 单位 - 根据视口的宽度或高度调整文本大小

分别是视口宽度的 1/100 和视口高度的 1/100。

h1 {
font-size: 22vw;
}
<h1>Test</h1>

More information

【讨论】:

    猜你喜欢
    • 2013-07-28
    • 1970-01-01
    • 1970-01-01
    • 2012-01-15
    • 2019-06-16
    • 2010-10-09
    • 2012-05-11
    • 2015-01-16
    • 2018-02-08
    相关资源
    最近更新 更多