如何强制 Firefox(或任何其他浏览器)缩放文本和图像以适应显示器的分辨率？
<meta name="viewport" content="initial-scale=1; target-density=device-dpi; user-scalable=no; shrink-to-fit=yes">
可悲的是什么都不做。
<!DOCTYPE html>
<html style="height: 100%; width: 95%">
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1; target-density=device-dpi; user-scalable=no; shrink-to-fit=yes">
<link href="bootstrap.css" rel="stylesheet">
</head>
<body style="height: 100%; width: 95%; padding: 0.313em; word-wrap: break-word">
<div class="container">
<div class="row">
<div class="col-xs-7 col-md-5" style="height: 40em; min-width: 25em; border-top: solid; border-bottom: solid; border-color: black; margin:1.250em">
<h3 align="center"> Statistics </h3>
<table class="table" style="width:100%">
<thead style="text-align: left">
<tr>
<td style="border:none"><td>
</tr>
<!-- Repeat a dozen times -->
</thead>
</table>
<div>
<div class="col-xs-7 col-md-5" style="height: 40em; border-top: solid; border-bottom: solid; border-color: black; margin:1.250em">
<img src="diagramm.png"></img>
</div>
</div>
</div>
</body>
</html>
最佳答案
我要在黑暗中拍摄一张照片，然后说您的视口(viewport)元数据不是您应该使用的。改为这样做
<meta name=viewport content='width=device-width, initial-scale=1'>
以设备 dpi 为目标并缩小以适应设备并没有错，但您必须非常了解您要实现的目标以及将会发生的情况。我展示的元数据是通用的，适用于任何地方。
关于html - 强制 Firefox 缩放适合设备尺寸的内容，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47906794/