删除bootstrap的样式引用,就可以正常打印预览了。

bootstrap 设置了@media print相关属性导致

@media print {
* {
color: #000 !important;
text-shadow: none !important;
background: transparent !important;
box-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
content: " (" attr(href) ")";
}
abbr[title]:after {
content: " (" attr(title) ")";
}
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: "";
}
pre,
blockquote {
border: 1px solid #999; page-break-inside: avoid;
}
thead {
display: table-header-group;
}
tr,
img {
page-break-inside: avoid;
}
img {
max-width: 100% !important;
}
p,
h2,
h3 {
orphans:;
widows:;
}
h2,
h3 {
page-break-after: avoid;
}
select {
background: #fff !important;
}
.navbar {
display: none;
}
.table td,
.table th {
background-color: #fff !important;
}
.btn > .caret,
.dropup > .btn > .caret {
border-top-color: #000 !important;
}
.label {
border: 1px solid #000;
}
.table {
border-collapse: collapse !important;
}
.table-bordered th,
.table-bordered td {
border: 1px solid #ddd !important;
}
}

代码里面的 color:#000 !important; 以及 。它表示打印时,页面中的文字都为黑色,并且背景色都设置为透明。因为有了这样的样式,我们的背景色就打印

不出来了。去掉这两段代码。

值得一提的说:如果页面中有超链接,打印时会显示超链接的地址,这样比较难看。我们删除对应的样式即可。

Bootstrap打印问题的更多相关文章

  1. Appium Server源码分析之作为Bootstrap客户端

    Appium Server拥有两个主要的功能: 它是个http服务器,它专门接收从客户端通过基于http的REST协议发送过来的命令 他是bootstrap客户端:它接收到客户端的命令后,需要想办法把 ...

  2. 如何用css写打印样式

    打印样式 打印样式就是针对网页被打印时设置给文档的样式,由于打印时是显示在纸上,跟屏幕还是有区别的,对于有打印需求的网页往往需要设置专门的打印样式来适配页面. @media print 声明自己是打印 ...

  3. 基于Metronic的Bootstrap开发框架经验总结(14)--条码和二维码的生成及打印处理

    在很多项目里面,对条形码和二维码的生成和打印也是一种很常见的操作,在Web项目里面,我们可以利用JS生成条形码和二维码的组件有很多.本文引入两个比较广泛使用的JS组件,用来处理条形码和二维码的生成处理 ...

  4. 基于Metronic的Bootstrap开发框架经验总结(9)--实现Web页面内容的打印预览和保存操作

    在前面介绍了很多篇相关的<Bootstrap开发框架>的系列文章,这些内容基本上覆盖到了我这个Bootstrap框架的各个主要方面的内容,总体来说基本达到了一个稳定的状态,随着时间的推移可 ...

  5. css去掉使用bootstrap框架后打印网页时预览效果下的超链接

    在我们写网页的时候,超链接是链接各个页面的桥梁,也是搜索引擎爬虫(spider)收录网站页面的关键,因此,在每个网页中会有许多的超链. 今天,一个同行妹妹在使用了bootstrap框架来搭建自己的网站 ...

  6. BootStrap带样式打印

    在新窗口打印时bootstrap表格的样式出不来,因为打印时没有加载CSS样式. 我在jquery.PrintArea.js的基础上改造了下打印的方法: (function ($) { var pri ...

  7. (转)基于Metronic的Bootstrap开发框架经验总结(9)--实现Web页面内容的打印预览和保存操作

    http://www.cnblogs.com/wuhuacong/p/5147368.html 在前面介绍了很多篇相关的<Bootstrap开发框架>的系列文章,这些内容基本上覆盖到了我这 ...

  8. 基于Metronic的Bootstrap开发框架--资产编码打印处理

    在开发业务管理系统的时候,往往涉及到资产信息及编码的打印处理,如我们需要对资产信息.条形码.二维码一起打印,以便贴在具体资产信息上面,方便微信公众号.企业微信进行业务处理,那么编码的打印就很有必要了, ...

  9. springmvc4 mybatis 整合 框架源码 bootstrap

    A集成代码生成器 [正反双向(单表.主表.明细表.树形表,开发利器)+快速构建表单 下载地址    ; freemaker模版技术 ,0个代码不用写,生成完整的一个模块,带页面.建表sql脚本,处理类 ...

随机推荐

  1. App服务端架构变迁

    随着移动互联网时代的到来,移动技术也随之飞速发展.如今,App已然成为绝大多数互联网企业用来获取用户的核心渠道.以往以PC为主要承载平台的各业务线,源源不断集成加入到移动项目中来,原本以产品为中心快速 ...

  2. js中字符串转换为数字

    js 字符串转化成数字的三种方法主要有 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后 ...

  3. C++ STL中允许重复key的multimap

    在实际的项目中可能会碰到key重复的情况,正常的MAP类型是不允许重复的key,所以就要使用multimap了,multimap的使用和map基本类似,可以无缝对接 #include <map& ...

  4. webSQL 实现即时通讯

    websql存储方式一共有以下几个方法 openDatabase:这个方法使用现有的数据库或新建数据库来创建数据库对象. transaction:这个方法允许我们执行事务处理; executeSql: ...

  5. sql server 数据加密

    select EncryptByPassPhrase('hksjlm',qlrmc)jmsj,* into jmqlr from qlr where qlbh in('5201411120005',' ...

  6. Linux-查看进程的完整路径

    通过ps及top命令查看进程信息时,只能查到相对路径,查不到的进程的详细信息,如绝对路径等.这时,我们需要通过以下的方法来查看进程的详细信息:Linux在启动一个进程时,系统会在/proc下创建一个以 ...

  7. CENTOS 下安装APK反编译工具 APKTOOL

    转于:http://www.qiansw.com/centos-apk-apktool.html 我使用的是CentOS6.4 64位的系统.首先需要下载两个包.这里下载:https://code.g ...

  8. PCIe to AXI Translation——PCIe 内存空间到AXI内存空间的转换

    PCIe to AXI Translation——PCIe 内存空间到AXI内存空间的转换 UltraScale系列芯片包含PCIe的Gen3 Integrated Block IP核在内的多种不同功 ...

  9. Oracle之sqlplus显示中文出现乱码

    解决办法: win+R快捷键>>--regedit>>HKEY_LOCL_MACHINE>>SOFTWARE>>ORALCE>>KEY_OR ...

  10. 把一个project相关的jar放到project的lib文件夹中

    例如你有一个project名为xxx,/xxx 文件夹中有src.bin.等等,然后你手工创建一个lib文件夹,这样你就把解压出来的第三方lib(jar包,含javadoc)都放到lib文件夹中,这样 ...