font-size 相关问题

一个CSS属性，用于设置字体的大小，如在几个不同单位之一中指定的那样。

JSBIN：https://jsbin.com/subipamero/edit?html,css,output HTML：这是 20 像素的文本这应该显示为 4px 大小的文本 (20px * .2) JSBIN：https://jsbin.com/subipamero/edit?html,css,输出 HTML： <div>This is 20px text</div> <div class="shrunk">This should appear as 4px size text (20px * .2)</div> CSS： div { font-size: 20px; margin: 20px; } div.shrunk { zoom: .2; } JSBIN 示例呈现两个 div。文本设置为 20px。然而，第二个 div 上设置了 zoom: .2。如果您在 Safari 和 Chrome 中并排打开这些内容，您会发现 Safari 中的缩放文本更大。如果您使用 Safari 中的缩放设置，您会发现有一个充当最小字体大小设置的东西，您根本无法将文本缩小得更小。有人知道为什么 Safari 会这样做吗？有没有办法克服这个问题？我应该注意，我没有将 Safari 首选项设置为“从不渲染小于 x 大小的类型”。问题是我正在设计一个信息亭，它会被卡在特定的长宽比上。但所使用的浏览器（全屏）的大小可能会有所不同（目前未知变量）。所以我只是使用一点 JS 来缩放内容以适应任何视口大小。在 Chrome 中，这意味着无论我将浏览器设置为什么大小，屏幕上的所有内容都会作为一个整体进行缩放，并且不会出现任何中断（除了它太小而无法阅读/查看）。但是在 Safari 中，由于这个奇怪的字体问题，当你缩小内容时，它很快就会崩溃。我猜 Safari 就是这样，我可能可以通过一些更周到的设计/布局更改来解决这个问题。但我很好奇 Safari 在这里做什么，如果它是已知的事情的话。更新：有人指出我这个关于使用-webkit-text-size-adjust: 100%的答案。这可能会“修复”移动 Safari 中的问题，但在桌面上不起作用。是的，Safari 似乎有一个下限，可以防止文本在值小于 zoom 时受到 0.5 的影响。我们可以从缩放文本的渲染结果中看到这一点 1~0.1: text at zoom:1.0 text at zoom:0.9 text at zoom:0.8 text at zoom:0.7 text at zoom:0.6 text at zoom:0.5 text at zoom:0.4 text at zoom:0.3 text at zoom:0.2 text at zoom:0.1 以下是该文本在三个 Mac 桌面浏览器中的呈现方式：铬野生动物园火狐几乎可以肯定，苹果选择这样做是出于可访问性的原因。当设计师假设所有观众的视力都和他们自己一样好时，文本太小而难以阅读是一个经常出现的问题。苹果非常重视可访问性，所以看到这个限制我并不感到惊讶。我并不是说我同意设置硬性限制，因为这对于某些 CSS 动画来说可能是一个问题，防止出现“淡出”类型的缩小效果，仅举一个例子。如何解决这个问题？我能想到几个选项。首先，必须问一个问题：为什么您希望设计中的文本太小而难以阅读？我能想到几个有效的用例：用例 1：类似图像的文本用法您的设计包含其他设计的缩略图 - 例如，您有一个宣传书籍的广告横幅。这本书的封面位于横幅上。这本书的封面上有一些文字太小而无法阅读，但我们仍然了解其要点，所以没关系。在这种情况下，请将书籍封面转换为图像（如果尚未转换为图像）。在某些情况下，将文本转换为 SVG 或其他图像格式是可以的。对于文本来说，矢量格式通常优于光栅格式。如果您的文本看起来那么小，那么它可能无法像普通文本一样发挥作用。考虑将其视为图像。用例 2：带有动画过渡的文本文本 zoom 属性将被动画化（如上所述）。在这种情况下，请考虑对其他 CSS 属性进行动画处理，例如 transform scale() translate(); 请注意，scale()具有不幸的副作用，即相对于其transform-origin偏移元素。这是没有办法的——这就是缩放的作用。而translate()往往需要与scale()配合使用来抵消定位变化。我暂时保留这个答案。但如果你能描述这个小文本的目的和功能，以及为什么你相信它不会给你的听众带来问题，我可能会有更多的想法。也许有更好的方法来完成您正在尝试做的事情。

css safari zooming font-size

回答 1 投票 0

C++ 控制台程序读取和打印具有可选字体和样式的文本

我将编写一个C++控制台程序，它可以读取我的输入文本并以可选择的字体和样式打印它（例如循环滚动和逐一打印）。我怎样才能做到这一点？谢谢你们...

c++ console font-size print-style

回答 1 投票 0

从 Markdown 到 PDF：如何使用 Pandoc 更改字体大小？

我正在使用 Pandoc 将一些 Markdown 文件转换为 PDF，如下所示： pandoc input.md -V 几何:margin=1in -o output.pdf 默认情况下，pdf 中的字体非常小。我想让一切...

pdf latex font-size pandoc

回答 4 投票 0

CSS：如何调整字体大小以合理的布局填充所有空间？

如何使用 CSS 使我的文本看起来如下图所示？