相关疑难解决方法(0)

在分页符上更改文档流以填充空间

当打印(或者,通常,在分页媒体上显示文档)时,是否可以重排文档元素,以便当某个元素(例如图像)转移到下一页因为它不适合实际页面上的可用空间时,它后面的元素会被移动到实际页面的剩余空间吗?

我试图达到类似于(或相同)LaTeX Floats的效果,但只使用CSS.

为了说明它,让我们说我们有这种情况:

Page 1  | Paragraph A (...)   |
        | Paragraph B (...)   |
        |  _________________  |
        | | Top of image A  | |
        |_|_________________|_|

         ---- page break -----
         _____________________
Page 2  | | Rest of image A | |
        | |_________________| |
        |                     |
        | Paragraph C (...)   |
        | Paragraph D (...)   |
        |         ...         |
        |_____________________|
Run Code Online (Sandbox Code Playgroud)

使用一些基本的CSS(参见这个问题),实现这一点没有问题:

Page 1  | Paragraph A (...)   |
        | Paragraph B (...)   |
        | …
Run Code Online (Sandbox Code Playgroud)

css printing-web-page css3 css-paged-media

15
推荐指数
1
解决办法
1088
查看次数

Page-break-inside:避免不工作

我有一个用于我的(Wordpress)网站的打印样式表,我想要在单个页面上打印图像而不是在页面上拆分.在某些情况下,甚至文本行都在页面之间分割.我已经包含img {page-break: avoid;)在我的打印样式表中,但没有运气.我找到了一些以前的答案,但它们有点老了.

是否有可靠的方法在单个页面上打印中等大小的图像而不是在页面上拆分?为什么文本行跨页?

图片分为两页

跨越页面的线条

网站:http://74.220.217.211/housing-developments/grafton-townhomes/

相关文章:

html css printing wordpress page-break-inside

9
推荐指数
3
解决办法
6351
查看次数

什么是最有用的media ="print"特定的,跨浏览器兼容的css属性?

什么是最有用的media="print",跨浏览器兼容的CSS属性?

我认为我们有这5个属性用于打印特定.

  1. 分页符,前
  2. 分页,后
  3. 分页,内
  4. 寡妇
  5. 孤儿

请解释何时何地使用这些?哪些是跨浏览器兼容的?什么是其他常见的CSS属性可用于打印,除了display:none

css printing xhtml cross-browser

7
推荐指数
2
解决办法
5510
查看次数

如何避免跨页面拆分 HTML 中的 DIV

下面是我的代码:

<!DOCTYPE html>
<html>
<head>
<style>
    @media print
    {
      .page-break  { display:block; page-break-inside: avoid;}
    }

} 
</style>    
</head>
<body>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This is some text.</p>
  <p>This …
Run Code Online (Sandbox Code Playgroud)

html css

5
推荐指数
1
解决办法
2187
查看次数