关于页面打印window.print()的样式问题

当我们打印网页的时候。有时候会发现。打印出来的。跟网页上看到的样式的差别有点大。这其中可能有的问题是。样式问题。

当调用打印(window.print())方法时。打印机会在网页的样式中查找 @media print{}的样式，并适应到要打印的网页中。

所以如果要打印的页面符合看到的页面效果，最好在写套样式

<style   type="text/css">     /* @media print 为打印时适应的样式表*/
  @media   print   {
  body   {   font-size:   12px}  ...../*其它的样式*/
  }
  </style>

时间： 2024-10-15 07:02:36

关于页面打印window.print()的样式问题的相关文章

Web window.print() 打印

web打印 window.print() 我只给出比较有效的,方便的打印方法,有些WEB打印是调用ActiveX控件的,这样就需要用户去修改自己IE浏览器的Internet选项里的安全里的ActiveX,将它们全部启用,有些麻烦,翻了下网络, 下面的方法是可以直接打印,而不会去修改IE的Internet选项. window.print来打印页面,页面上别的元素也会被打印处理,页头页尾的格式也不好控制.• 常用方法:大部分情况会把查询的结果绑定到DataGrid上来,然后打印DataGrid.这种

window.print()打印页面指定内容（使用iframe保证原页面不失效）

使用window.print()时会出现两个问题: (1)直接使用window.print() 打印的是整页内容-->无法实现打印指定区域 (2)打印时替换body中的内容,打印完成后再替换回来-->这样会导致原来页面事件失效使用iframe即可打印指定内容,也可保证页面不失效,具体方法如下: 1.将打印的内容独立出来为一个print.html文件,并为页面添加打印事件 <!DOCTYPE html> <html> <head> ... </head

使用window.print实现网页打印

Window.print()方法用于在浏览器中打印当前窗口的内容,如果想要打印当前窗口中指定部分的内容的话需要其他的一些特殊的处理; Demo: <html> <head> <title>页面标题</title> <style type=”text/css” media=”print”> #button{ //隐藏网页中的打印按钮 display:none; } </style> <script type=”javscript”

使用jqprint插件完成页面打印

jqprint是一个基于jquery编写的页面打印的一个小插件,但是不得不承认这个插件确实很厉害,最近的项目中帮了我的大忙,在Web打印的方面,前端的打印基本是靠window.print()的方式进行打印的,而这个插件在其基础上进行了进一步的封装,可以打印网页上的某个区域,这是个亮点.比如说现在要打印如下的一个效果: 我们可以通过写代码完成上述的效果,然后单击网页上的某个按钮,在按钮的处理方法里调用jqprint(),来完成这个区域的的打印显示的操作,首先要获取这个区域,然后调用一个方法即可了,

Jqprint 轻量级页面打印插件

最近公司项目用到了页面打印功能,不能不承认,JQ的这个打印插件很小巧功能很强大 1.首先需要引入必须的js文件 <script language="javascript" src="jquery-1.4.4.min.js"></script><script language="javascript" src="jquery.jqprint-0.3.js"></script> 2.

firefox和chrome实现页面打印自动分页

在Firefox和chrome中直接调用打印功能的js方法是 window.print(); 但是如果页面很长,那么就需要分页,这时只需要在页面中添加css属性即可,如果想自动分页,则如下所示 <style type="text/css" media="print"> div { page-break-after:auto; page-break-inside:auto; page-break-before:auto; } </style>

javascript之页面打印

WebBrowser组件是IE内置的浏览器控件,使用时,首先要在<body>标签的下面用<object>...</object>标记声明WebBrowser组件,代码如下: <object id="WebBrowser1"width="0" height="0" classid = "CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"> <

js或jquery实现页面打印可局部打印

1.js实现(可实现局部打印)代码如下: <html><title>js打印</title><head></head><body><input id=btnprint type=button value=打印 onclick=javascript:window.print(); /> <input id=btnprint type=button value=打印预览 onclick=preview(1) />&

js或jquery实现页面打印(局部打印)

1.js实现(可实现局部打印) 复制代码代码如下: <html> <title>js打印</title> <head></head><body> <input id="btnPrint" type="button" value="打印" onclick="javascript:window.print();" /> <input id=&