print css：适合一页

在我的页面里只有一张图片。种类1500x3000像素。
在打印机中，我需要将此图像的最大宽度设置为页面的宽度，所以我做了：在css中宽度为100％，并且工作正常。
但高度......高度100％的旧废话绝对不会奏效。因为它始终是父容器的100％，所以有人必须定义高度。或者html或body。
所以，我的问题是：让这张图片适合一个页面。
任何想法？print css：适合一页

来源

2010-03-12 bluefoot

为把好对不起你也可以前后的图像，这是这样做之后添加CSS分页样式一个div “解决方案”作为评论：

我最终做的是假设99％的客户（这是真的）他们使用单一页面大小。所以我在打印界面中加入了一些警告，该界面只适用于页面大小“X”。太糟糕了。但它运行到目前为止

来源

2011-02-12 18:16:36 bluefoot

做到这一点的一种方法是执行一些计算来找出什么宽度会导致长度恰好是一页，然后相应地在CSS中设置宽度。

来源

2010-03-12 19:01:46

eyah，我做到了。我把宽度：100％，但这不足以适应页面上的高度，因为页面大小的众多变化...... – bluefoot 2010-03-14 12:58:26

如果我没有理解这个权利，你可以做

.OnePageImage { height: 100%; width: 600px; }

凡600px的（宽度）页面的总宽度。然后图像将适合在一个页面上（尽管可能有一些失真）。

.break { page-break-after:always; }

然后代码是这样的：

<div class="break"></div> 
<img src="[your image src]" class="OnePageImage" /> 
<div class="break"></div>

来源

2010-05-08 23:32:06 theJerm

好吧，它也不适用于我。我最终做的是假设99％的客户（这是真的）他们使用单页面大小。所以我在打印界面中加入了一些警告，该界面只适用于页面大小“X”。太糟糕了。但到目前为止它已经行得通 – bluefoot 2010-12-30 10:32:46

将打印输出限制为单个页面的唯一方法是将包装整个页面的容器元素的高度设置为cm，并将其设置为隐藏溢出。出于某种原因，这似乎不适用于身体元素。

body > section { padding:0 !important; margin:0 !important; height:25.7cm !important; overflow:hidden !important; }

顺便说一句，我曾希望设置分页-内，避免在身体上或容器元素可能已经解决限制到一个单一的打印页面，但似乎并未有任何影响。

来源

2013-04-24 14:56:51 atomless

print css：适合一页

回答

相关问题