Question

由于我有谷歌这个并得到很多答案，但只有调整字体大小，我需要根据屏幕大小调整/增加 - 减少字符串的长度。

我正在使用动态文本创建具有多个页面的混合应用程序，并希望将该文本设置为div以用于设备的修复长度，如果文本长度大于设备的高度，则将新div设置为新页面。

<!-- for eg. Device Height 480px  -->
<div class="page">
    test text and the
    text that is store
    here with full length
    of the div and device
    is no longer to adjust
</div>
<div class="page"> <!-- This become another page of application -->
    all this string.
</div>

<!-- Device Height 640px -->
<div class="page">
    test text and the
    text that is store
    here with full length
    of the div and device
    is no longer to adjust
    all this string.
</div>

目前，我正在将图像作为页面处理为div，并将其设置为全宽和自动高度到屏幕中心。但实际上，我需要将动态文本设置为该div。所以我需要任何对我有帮助的建议。

<!-- Working - With an image -->
<div class="page">
    <img src="images/page1">
</div>
<div class="page">
    <img src="images/page2">
</div>

Answer 1

你可以使用带排版或任何东西的wiewport ......

＆＃13;

body {
  font-size: 1vw;
}
img {
  width:99vw;
}

＆＃13;

链接：https://css-tricks.com/viewport-sized-typography/

根据屏幕大小调整（增加/减少）字符串长度

1 个答案: