CSS:在模式中打印长div，在IE中没有第二页
CSS（Cascading Style Sheets，层叠样式表）是一种用于描述网页内容在浏览器中展示样式的标准语言。它可以定义网页元素的样式、布局和外观，实现网页内容的美化和排版。CSS可以应用于HTML、XML等各种标记语言，并通过选择器来选择需要样式化的元素。
对于在模式中打印长div，在IE中没有第二页的问题，可以使用CSS的@media规则来定义打印样式，并通过page-break-inside属性来控制页面内元素的打印方式。
具体的解决方案如下：
- 首先，我们需要创建一个CSS样式文件，例如
print.css。 - 在
print.css中添加如下代码：
@media print {
.long-div {
page-break-inside: avoid;
}
}上述代码使用@media规则指定了打印时的样式，并使用.long-div选择器选择了需要避免分页的长div元素，并设置page-break-inside: avoid;来避免在长div内分页。
- 在HTML文件的
<head>标签中引入print.css样式文件：
<link rel="stylesheet" type="text/css" href="print.css" media="print">上述代码将print.css样式文件应用于打印媒体类型。
- 在需要打印的HTML页面中，为需要避免分页的长div添加
long-div类名：
<div class="long-div">
<!-- 长内容 -->
</div>通过以上步骤，可以实现在打印模式中打印长div时，在IE中避免出现分页的问题。
对于推荐的腾讯云相关产品和产品介绍链接地址，可以参考以下内容：
- 腾讯云云服务器（CVM）：提供基于云计算的虚拟服务器实例，支持多种操作系统选择，具有高性能、高可靠性和灵活扩展等特点。详情请参考腾讯云云服务器。
- 腾讯云内容分发网络（CDN）：提供全球覆盖的内容分发服务，可以加速网站访问、降低带宽成本、提高用户访问体验。详情请参考腾讯云内容分发网络。
- 腾讯云数据库（TencentDB）：提供多种数据库产品，包括关系型数据库（如MySQL、SQL Server）和NoSQL数据库（如Redis、MongoDB），支持高可用、高性能和弹性扩展。详情请参考腾讯云数据库。
请注意，以上推荐的腾讯云产品和产品介绍链接地址仅供参考，具体选择产品需根据实际需求进行评估和决策。
相关·内容
2回答
，它是通过iframe和2个css的混合完成的，一个在主项目中，一个在iframe本身中。css打印隐藏所有内容，打印时只显示模式内容，所以如果您尝试直接在主页上打印，您将只有一个白色页面。我在Chrome中的orientation字段有问题，在所有其他浏览器中都没有第二个页面，但在深入研究Bootstrap问题后，我发现这个问题可以用以下命令覆盖CSS<
浏览 35提问于2019-02-22得票数 0
回答已采纳
1回答
在打印时，我遇到了IE8中元素的绝对定位问题。我有我的打印样式表，在这里，我试图在第一个打印页面的右上角放置一个元素。.myElem{ top:0;
ri
浏览 5提问于2011-05-23得票数 2
1回答
我有滚动条的模式窗口，同时打印模式窗口。我在IE edge中多了一个空白页。如果我使用下面的CSS代码，我能够得到我想要的超过一页的数据，也就是说，如果模式有三页的数据，IE edge & chrome恰好打印三页就很完美了。但是，如果我在IE边缘只有一页数据，那就是打印</e
浏览 1提问于2016-05-27得票数 0
1回答
在IE中打印html图
、、、
我想和大家分享我在(所有版本)中打印html页面时遇到的问题。
我有一个图表，需要用IE7打印。这个图表有几页长，所以我把它剪成了薄薄的窗口，可以(通过滑块)与A4大小相匹配。它在Chrome和FF中工作得很好。但是在IE中，我只得到了打印出的图表的底部部分。该部分正在打印在页面的顶部，从第二页开始。此外，IE
浏览 3提问于2014-01-03得票数 0
回答已采纳
1回答
我有一个页面，它包含一个‘可打印视图’按钮，点击这所有的内容将自动填充到‘引导’模式。@media print{ visibility: hidden; }JS
$('#modal-Printbtn').
浏览 1提问于2016-10-13得票数 0
1回答
我正在为我最近构建的web地图应用程序添加基本的打印功能，在标准模式下使用Internet 8时，我似乎无法使打印工作正常。我希望有更多CSS经验的人能够提供帮助。我在jsbin上创建了一个基本示例，演示了我所看到的内容：。此示例在大多数浏览器中正确打印。然而，在标准模式的Internet 8中，地图的平铺图像在打印时从第一页运行到第二页
浏览 4提问于2011-11-27得票数 0
回答已采纳
我们有一个客户从一个网站上打印了几个页面。大多数情况下，它很好用。但是，偶尔，Internet 8只打印第一页，即使选择了所有页面。再一次，大多数情况下，它可以正常工作--大概90%或更多的时间。在这种情况下，有时只需重新打印(按Ctrl+P以使打印对话框恢复)就可以修复它。有时，我们必须关闭弹出窗口(是的，页面是用window.open()调用的)，然后重新打开，然后重新打印。这种情况发生在各种打印机和打印机驱动程序上。是的，IE8
浏览 0提问于2009-05-11得票数 3
回答已采纳
在下面的代码中，第一个和第二个带有锚点的图像具有链接，并且在这些图像中，标题文本在页面加载时不会隐藏(不透明度为0)，在排版模式下为IE 6/ IE7或IE8。以下是中的代码我会在这里发布整个代码，但它相当长，我在这样做时遇到了问题。$(this).css('opacity'
浏览 3提问于2010-09-13得票数 2
回答已采纳
我使用CSS打印样式表为打印时的页面元素提供另一种样式，并隐藏我们不希望打印的样式。另外，如何防止页面周围的边框和页码的显示
浏览 2提问于2011-07-13得票数 3
回答已采纳
14回答
我正在处理一个可打印的事件列表，打印机打印一页很好，但将底部的一些文本剪掉，然后打印第二张空白页
我已经试过我所知道的一切，但还是不知所措。
浏览 2提问于2009-08-21得票数 51
回答已采纳
3回答
在每页中打印页眉
、、、
我已经创建了一个报告，下一步是创建一个页眉，它将打印在每一页中。我试过使用提供的解决方案--但它们在webkit浏览器上似乎不能很好地工作。
你有没有想过在我的报告中实施这个选项？
浏览 1提问于2011-10-16得票数 5
2回答
我被要求在html网页的每个页面的底部打印出一个页脚(而不是浏览器上的实际页面)。你们知道怎么做吗？(它应该可以在IE上工作，IE就可以了)
我尝试使用固定底部，但内容与页脚重叠。我尝试使用javascript计算空间，并给出一个空的div高度:如果页脚的底部% page height !=0，则添加所需的间距。但是页脚底部的值和所需的空白似乎会随着元素类型的改变而改变。bottomPos) : printPageHeight - (bottomPos % printPage
浏览 0提问于2013-07-05得票数 11
回答已采纳
3回答
我们也有另一个遗留的web应用程序，这是包括在我们的网页之一的iframe。这个遗留的web应用程序只在古怪的模式下工作。我们需要在我们公司的基于浏览器的应用程序中完成这项工作，该应用程序运行在浏览器mode=IE9中，并具有IE8的css & js引擎，即doc mode=IE8。现在，我的要求是在IE8文档模式下启动浏览器的第一页，在
浏览 1提问于2014-04-19得票数 3
回答已采纳
1回答
将table-footer-group作为样式添加到TFOOT中会导致它(在Internet中)在表跨的每一页的底部打印： tfoot { display: table-footer-group; }但是，如果将IE9 (发布候选版本)置于标准模式中：
<!在IE</
浏览 2提问于2011-03-09得票数 8
回答已采纳
我有一个恼人的问题，试图让一个带有谷歌地图的html页面正确打印，我有一个谷歌地图，上面的所有内容都包装在一个div中，div在css中被设置为‘page -break- the : always；’，问题是，只有在IE8中，我总是可以在打印时看到在上一页上呈现的地图的很大一部分，而且在上一页上可见的地图部分是地图可见边界之外的部分。of text</p>
浏览 1提问于2010-06-11得票数 3
回答已采纳
1回答
我正在使用一个应用程序来打印纵向和横向模式的页面together.some页面打印在纵向和一些是在landscape.Printing的页面无论是纵向或横向外观good.But打印纵向和横向的页面在一起width:100%; }
display: none;
div.pageBreak
浏览 15提问于2019-03-15得票数 0
3回答
但我的问题不是关于页脚在浏览器中的样子，而是在打印输出中。</div> <table> </footer></html>
请注意，我的内容是动态的，它可以是长的或短的，基于用户的输入。在浏览器中我没有任何问题，页
浏览 0提问于2012-09-30得票数 1
回答已采纳
Firefox最新版本的打印预览(在windows中)显示如下所示：应该有两页，但它只显示第一页。如你所见，第二页的标志被切断了。可能是什么原因造成的？
浏览 4提问于2017-04-19得票数 9
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
