是否可以使font-size参数依赖于文本的长度?当然,我可以意识到使用JavaScript是可能的,但我不想这样做。;)
我有一个宽高140px的盒子。内容应为100px w+h(箱体填充物:20px)。我的文本应该使用这个100px宽度最好。同样,在页面上的文本更改(AJAX)中,文本应该分配为width=100px。
有可能吗?
如果您事先知道文本的长度,那么您可以根据CSS中的屏幕大小设置媒体查询,从而相应地调整字体大小。
@media (max-width: 367px) {
.myContainer {
font-size: 8px;
}
}
@media (min-width: 368px) and (max-width: 1024px) {
.myContainer {
font-size: 12px;
}
}
@media (min-width: 1025px) {
.myContainer {
font-size: 16px;
}
}
如果您使用服务器端技术动态生成文本,您应该能够看到文本长度,并设置适当的类来调整字体大小:
// Example pseudo-code to illustrate the point...
int len = myText.length();
if (len > 2000) {
setOutputClass("smallestSize");
} else if (len > 1000 && len < 2000) {
setOutputClass("mediumSize");
} else {
setOutputClass("largestSize");
}
和CSS中相应类规则:
.smallestSize {
font-size: 8px;
}
.mediumSize {
font-size: 12px;
}
.largestSize {
font-size: 16px;
}
我非常肯定在CSS中没有办法确定文本的长度,所以最终您可能会被迫使用JavaScript或以不同的方式处理解决方案。
我正在使用SVG将一些lat-lons映射为折线。这管用。我现在要添加一些适当的可缩放大小的文本。 这个简化的示例应该显示三个不同大小的字母。Firefox只显示2个,每个大小相同。Chrome、Opera和Edge都不显示字母。有一些行显示字母应该在哪里,所以我知道它在视区内。
实现动态改变WebView加载的网页的字体大小。 [Code4App.com]
引用MultiLanguage.nsi的内容: ;NSIS Modern User Interface ;Multilingual Example Script ;Written by Joost Verburg ;-------------------------------- ;Include Modern UI !include "MUI.nsh" ;-------------------
我会保持简短直截了当,这样我就明白了: > vw根据视区宽度更改字体大小。 VH根据视区高度更改字体大小。 我的问题是; 有没有一种方法可以根据视区的宽度和高度来缩放我的字体大小?因此,改变浏览器的高度和宽度将适当地缩放我的字体大小。 我这样问是因为我想根据它们所在的容器适当地缩放我的文本大小,我的问题是容器缩放到100%的宽度和100%的高度。因此,根据高度和宽度来缩放文本大小似乎是合乎逻辑的,
我从CoreData中获取对象,如下所示 并显示它: 如何在 中获得单元格的正确高度以返回它
我不明白为什么 span 元素的高度大于其字体大小(边距和填充 = 0):JSFiddle 示例 此问题仅存在于 Mac 中: 我们怎么能看到有3个额外的像素。Windows中的相同示例: 跨度的高度等于它的字体大小。